CSS doesn't toggle

The following successfully toggles the div landlord_pop_up. However, it doesn't set the css property for the div landlord_pop_up on toggle. Any ideas would be much appreciated. I am try to get the popupBox height to change from 20em to 42 em on toggle.

$(function () {
    $('#toggle1').click(function () {
        $('#landlord_pop_up').slideToggle(function () {
            $(".popupBox").css({
                "height": "42em"
            });
        }, function () {
            $(".popupBox").css({
                "height": "20em"
            });
        });
    });
});

Answers


This toggles the height of the pop up box after sliding:

$(function() {
    $('#toggle1').click(function() {
        $('#landlord_pop_up').slideToggle(function(){
            $(".popupBox").toggle(function () {
                $(this).height("42em");
            }, function () {
                $(this).height("20em");
            });
        });
    });
});

according to docs slideToggle takes duration as first argument. and you are providing a function

.slideToggle(duration,callback);

so you can do something like this

$('#landlord_pop_up').slideToggle(1000, 
function () { 
 $(".popupBox").css({"height":"20em"});
 $(".popupBox").css({"height":"42em"});
});

Need Your Help

How many DataTable objects should I use in my C# app?

c# .net sql-server datatable dataset

I'm an experienced programmer in a legacy (yet object oriented) development tool and making the switch to C#/.Net. I'm writing a small single user app using SQL server CE 3.5. I've read the concept...

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.