Javascript toggle effect help

+1 Vince Zen · October 1, 2014


Hello guys, im new in using javascript, Im trying to achieve the toggle effect or show/hide effect using javascript. Can you help me on how can I call the name of <div> so I can apply the effect on the js codes below?


$(document).ready(function() {
$("div class='ad0'").hide();
$("ad1").hide();
$("ad2").hide();
$("ad3").hide();

$("").click(function() {
$("").show(1000);

});
});







<div align="center" class="frame">   
        <div class="ad0">
           <div class="a0"><img src="images/sample/franky.png" width="350" height="500" alt="0" /></div>
           <div class="d0"><a>asdadaddad</a></div>
        </div>
        <div class="ad1">
           <div class="a1"><img src="images/sample/luffy.jpg" width="350" height="500" alt="0" /></div>
           <div class="d1"><a>asdadaddad</a></div>           
        </div>
        <div class="ad2">
           <div class="a2"><img src="images/sample/sanji.png" width="350" height="500" alt="0" /></div>
           <div class="d2"><a>asdadaddad</a></div>        
        </div>
        <div class="ad3">
           <div class="a3"><img src="images/sample/zoro.png" width="350" height="500" alt="0" /></div>
           <div class="d3"><a>asdadaddad</a></div>
        </div>
    </div>


Post a Reply

Replies

Oldest  Newest  Rating
+2 Susan Moss · October 2, 2014
Hello Vince!

jQuery uses CSS's like selectors, in order to select a class, use ".classname" between the parenthesis  (to select an id use "#idname", and so on).

Example:


$(document).ready(function() {
 $(".ad0").hide();
 $(".ad1").hide();
 $(".ad2").hide();
 $(".ad3").hide();

 $("").click(function() {
 $("").show(1000);

 });
});

This code hides all the elements with the specified classes...

In order to toggle an element use something like this:

$(".classname").click(function() {

$(this).toggle();

});


More info in the jquery learn site:
http://learn.jquery.com/using-jquery-core/selecting-elements/

I hope it works for you! :)
  • 1

Javascript

107,044 followers
About

A scripting language that is added to standard HTML to create interactive effects, apps, games for the browser.

Links
Moderators