开发者

toggle div element attached to closest class

Ok not sure why I tried using clossest class in jQuery but still not luck, basically I have a DIV class called SHARE attached to each ARTICLE(POST) for my blog, now when I or any one clicks share I wish for the hidden LI to show-up with additional function ex; facebook, twitter and email sharing.

I made this script which does the trick

$j(".share").live("click", function() {
         $j("li").toggle("slow");
});

but the problem with above code bit is that it will display all hidden LI elements for all articles how would I go about attaching it to single one?

The code is attached to DIV element inside class="article" as such

        <div class="date">$article_d<br><span>$article_m</span></div>
        <div class="share">share
             <ul>
             <li style="margin-left: 5px;display: none;">
                 <a href="$facebook_share">$facebook_share_img</a>
  开发者_开发技巧           <a href="$twitter_share">$twitter_share_img</a>
             <a href="$email_share">$email_share_im</a>
             </li>
             </ul>
        </div>

P.S. please ingore $j syntax since I am using jQuery with Mootools


$j(".share").live("click", function() {
   $j(this).find("li").toggle("slow");
});

The find method will select any li element within the clicked div. As the li elements in your example are descendants of the clicked div, this should work fine.

However, note that if you have any other li elements within the div, they will be affected too.

Here's a working example.


you might be able to use SuperFish for this. Superfish is actually for menu nav, but I think the principle of what you are trying to do is the same.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜