CODEWITHSUNDEEP
togglejquery
Anita Mandal
Anita Mandal

Reputation: 393

My JQuery Toggle not functioning properly

Why is my jQuery toggle function not working?

See this demo: http://project.4greality.com/category/budget-homes

My Code:

<script>
$(document).ready(function(){

$("a.switchThumb").toggle(function(){
  $(this).addClass("swap"); 
    $("div.containerDiv").fadeOut("fast", function() {
        $("#containerDiv").fadeIn("fast").addClass("displayToggleNone");

        });

    }, 

 function () {
  $(this).removeClass("swap");
    $("div.containerDiv2").fadeOut("fast", function() {
           $("#containerDiv2").fadeIn("fast").removeClass("displayToggleNone");

        });
    });
});
</script>

Upvotes: 0

Views: 339

Answers (1)

Selvakumar Arumugam
Selvakumar Arumugam

Reputation: 79850

I think you need something like below to toggle thumbnail and detailed view.

I am not sure why you try to fadeOut the div first and fadeIn the same again and then hide it.

Try below and let me know how it goes,

$(document).ready(function(){    
  $("a.switchThumb").toggle(function(){
    $(this).addClass("swap"); 
    $("#containerDiv").fadeOut("fast", function() {
        $("#containerDiv2").fadeIn("fast");
    });
  }, 
  function () {
    $(this).removeClass("swap");
    $("#containerDiv2").fadeOut("fast", function() {
           $("#containerDiv").fadeIn("fast");    
    });
  });
});

Upvotes: 1

Related Questions