以下にホバーオン効果を与えるために使用される次のJavaScriptコードが配置されています
ただし、以下の JavaScript コードでも、ホバーすると不透明度を 1 に変更できません。私を助けてください。以下のコードは間違っていますか?
1 つの注意点として、以下の li コードは 1 つのダミーの li に過ぎないということです。ページには同様の 35 個の li があるため、その特定の li タグにカーソルを合わせると、その li の show_on_hover 効果のみが表示されます。
JavaScript
$(".altbgcolor").live({
mouseenter: function() {
var el= $(this);
el.addClass('altbgcolor-active');
el.data('hover', setTimeout(function()
{
if (el.hasClass('altbgcolor-active'))
{
el.find(".sharedp").slideDown('normal');
el.contents().find(".show_on_hover").css("opacity","1");
}
}, 1500)
);
},
mouseleave: function () {
var el= $(this);
clearTimeout(el.data('hover'));
el.removeClass('altbgcolor-active')
.find(".sharedp")
.slideUp('normal');
}
});
リコード
<li class="altbgcolor" id=1436>
<div> <a href=http://mashup2.sunnydsouza.com/mobile/1436/ target="_blank" rel="nofollow">
<div class="newsthumb" center center no-repeat;"><img src="/images/mobile/thumb_1436_100X100.jpg" /></div>
</a>
<div class="newstext" style="margin:0px;">
<a href=http://mashup2.sunnydsouza.com/mobile/1436/full/ target=_blank style="text-decoration:none; "><h1 style="color:#081C28;"><img width="11" height="9" src="/content/icon_topic_newest.gif"> Twitter Reviews ‘The Hunger Games’ in 140 Characters or Less </h1></a>
<div style="font-size: 0.4em; color:#666666;">
<span style="text-decoration:none; color:none; "><i> via <a href="http://mashup2.sunnydsouza.com/user/1/" style="text-decoration: none;color:#105289 ;" onmouseover="this.style.textDecoration = 'underline'" onmouseout="this.style.textDecoration = 'none'">demo1</a></i></span>
<i>in <a href="http://mashup2.sunnydsouza.com/mobile/" style="text-decoration: none;color:red ;" onmouseover="this.style.textDecoration = 'none'" onmouseout="this.style.textDecoration = 'none'">Mobile</a></i>
<span style="text-decoration:none; color:none; ">
<a class="example7" href="comments_3.php?id=1436" style="text-decoration:none; color:#666666; "><img src="content/comment/comments.png" width=18 height=18><i>No comments</i></a></span>
<span class="show_on_hover" style="text-decoration:none; color:none; margin:5px; opacity:0.001;"><img src="content/styles/images/view_count_icon.png" > 38 views</span>
<span class="show_on_hover" style="text-decoration:none; color:none; margin:5px;opacity:0.001;"><img src="content/styles/images/rating_count_icon.png" > 6 votes</span>
<br><br>
<div class="ratings">
<div class="rating-L">
<form class="ratedStars" id="rat1436" action="" method="post">
<select name="rate"><option value="1436_1">Not so great</option><option value="1436_2">Quite good</option><option value="1436_3">Good</option><option value="1436_4" selected >Great!</option><option value="1436_5">Excellent!</option></select>
<input type="submit" value="Rate it!" />
</form>
</div>
</div> <br>
</div>
</div>
<div class="clear"></div>
</div>
<div class="sharedp">
<div style="font-size: 0.7em; color:#666666;">
<span style="text-decoration:none; color:none; "> Posted By: <a href="http://mashup2.sunnydsouza.com/user/1/" style="text-decoration: none;color:#105289 ;" onmouseover="this.style.textDecoration = 'underline'" onmouseout="this.style.textDecoration = 'none'">demo1</a></span>
| <span style="text-decoration:none; color:none; "> Date: <i>March 24, 2012, 1:03 pm</i></span> <t />
</div>
</li>