How can I fix this script when switching jQuery?

I tried to run this jQuery script, but maybe something is wrong. I wanted to make the script work by clicking on the arrow on the right side of the page. As you can see from the JavaScript code and the jsfiddle test, I am trying to make the slide down hidden # top-bg.

JavaScript Code:

$(document).ready(function() {
    $(".bottone").click(function() {
        $("#top-bg").slideToggle("slow");
        $(this).toggleClass("active"); return false;
    });
});

And this is the jsfiddle test: TEST

Where am I mistaken?

+4
source share
5 answers

You are using smart quotes, not regular quotes. In addition, there is no need for a tag a, you can remove it and apply the click function directly totriangolo

$("#triangolo").click(function(){
    $("#top-bg").slideToggle("slow");
    $(this).toggleClass("active"); return false;
});

Updated jsFiddle

+1

, .

:

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

$(".bottone").click(function(){
+5

You are using the wrong quotation marks, and also trying to click on an empty tag (so there really is nothing) ...;)

Here is the JsFiddle that works: http://jsfiddle.net/uazw6/11/

  <div id="top-bg" class="bg"></div>
   <div id="top" class="bg">
   <div id="triangolo"><a href="#" class="bottone">test</a>
       </div>
  </div>

Javascript:

$(document).ready(function(){

  $(".bottone").click(function(){
      $("#top-bg").slideToggle("slow");
      $(this).toggleClass("active");
  });

});
0
source

I fixed ... I updated your jsfiddle ... tested it ...

your code now looks below ...

$(document).ready(function(){

$("#triangolo").click(function(){
$("#top-bg").slideToggle("slow");
$(this).toggleClass("active"); return false;
});

});
0
source

You can also fix this problem by changing the code below

<div id="triangolo"><a href="#" class="bottone"></a>
           </div>

from

<a href="#" class="bottone"><div id="triangolo">
           </div></a>
0
source

All Articles