Содержание исчезает при переносе - PullRequest
Новая
       4

Содержание исчезает при переносе

2 голосов
/ 17 декабря 2011

Я использую этот эффект изображения для ссылок на иконки http://bavotasan.com/2009/creating-a-jquery-mouseover-fade-effect/

Я планирую, чтобы при наведении курсора на значок (эффект изображения выше) будет отображаться небольшое количество контента.под ним в том же темпе, что и эффект изображения.

Я новичок в javascript, но люблю изучать новые и творческие способы в нем.Я полагаю, что я больше всего люблю копировать и вставлять.

Любая помощь очень ценится!

РЕДАКТИРОВАТЬ: code:)

Вот функция javascript на страницеисчезают значки. (они работают) 

<script type='text/javascript'>
$(document).ready(function(){
$("img.a").hover(
function() {
$(this).stop().animate({"opacity": "0"}, "slow");
},
function() {
$(this).stop().animate({"opacity": "1"}, "normal");
});

});
</script>

Вот мой HTML-код для значков 

<div class="fade_con_about"><div class="fadehover"><a class="biofadein"><img src="clean/img/aboutbtn_up.png" class="a" alt="about"/></a><a class=""><img src="clean/img/aboutbtn_down.png" class="b" alt="about"/></a></div></div>

Затем я хочу, чтобы мое содержимое постепенно исчезало при наведении на эту иконку.Вот мой контент, но он просто отображается на странице как обычно. 

<div class="textual">
<h1><a href="http://" target="_blank">My Blog</a></h1><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt.<br/>
<a href="#">3 hours ago..</a></p>
</div>

Надеюсь, это даст лучшую идею

1 Ответ

1 голос
/ 17 декабря 2011 
<script type='text/javascript'>
$(document).ready(function(){
$("img.a").hover(
function() {
$(this).stop().animate({"opacity": "0"}, "slow");
$('.textual').fadeIn("slow");
},
function() {
$(this).stop().animate({"opacity": "1"}, "normal");
$('.textual').fadeOut("slow");
});

});
</script>
...