Issue with Sliding Up/Down a Hidden Div using .toggle()

Posted by user1760110 on Stack Overflow See other posts from Stack Overflow or by user1760110
Published on 2012-11-26T22:46:17Z Indexed on 2012/11/26 23:04 UTC
Read the original article Hit count: 207

Filed under:

jQuery

|

easing

Can you please take a look at this JSFIDDLE sample which I am trying to create a smooth animate of hidden div from down to up on mouse hover. As you can see the div appears from left down corner but I would like to animate it from bottom to top. I tried to use animate() but I didn't know how to change the hidden div statue from hidden? here is the code I am using:

$(document).ready(function() {
  $('#handler').hover(function(){$('#hidden').toggle(1000)});
});?

Can you please let me know how i can use jQuery easing plugin for something like this? Thanks

© Stack Overflow or respective owner

Related posts about jQuery

Microsoft and jQuery

as seen on West-Wind - Search for 'West-Wind'
The jQuery JavaScript library has been steadily getting more popular and with recent developments from Microsoft, jQuery is also getting ever more exposure on the ASP.NET platform including now directly from Microsoft. jQuery is a light weight, open source DOM manipulation library for JavaScript that… >>> More
An Introduction to jQuery Templates

as seen on Stephen Walter - Search for 'Stephen Walter'
The goal of this blog entry is to provide you with enough information to start working with jQuery Templates. jQuery Templates enable you to display and manipulate data in the browser. For example, you can use jQuery Templates to format and display a set of database records that you have retrieved… >>> More
Ajax Control Toolkit December 2013 Release

as seen on Stephen Walter - Search for 'Stephen Walter'
Today, we released a new version of the Ajax Control Toolkit that contains several important bug fixes and new features. The new release contains a new Tabs control that has been entirely rewritten in jQuery. You can download the December 2013 release of the Ajax Control Toolkit at http://Ajax.CodePlex… >>> More
jQuery show "loading" during slow operation

as seen on Stack Overflow - Search for 'Stack Overflow'
I'm trying to show a small loading image during a slow operation with jQuery and can't get it right. It's a BIG table with thousands of rows. When I check the "mostrarArticulosDeReferencia" checkbox it removes the "hidden" class from these rows. This operation takes a couple of seconds and I want… >>> More
Tracking download of non-html (like pdf) downloads with jQuery and Google Analytics

as seen on Developer IT - Search for 'Developer IT'
Hi folks, it’s been quite calm at Developer IT’s this summer since we were all involved in other projects, but we are slowly comming back. In this post, we will present a simple way of tracking files download with Google Analytics with the help of jQuery. We work for a client that offers… >>> More

Related posts about easing

Add an easing to jQuery animate() function.

as seen on Stack Overflow - Search for 'Stack Overflow'
Hello! I'm triying to add an easing function to this code. So I replaced "swing" with "easeInOutQuint" (for example) but it's not working. I'm using jquery 1.4.2 and jquery easing 1.3 downloaded from here (http://gsgd.co.uk/sandbox/jquery/easing/) Any help will be greatly appreciated! Thank you! $(window)… >>> More
jquery slideshow/cycle with easing not working

as seen on Stack Overflow - Search for 'Stack Overflow'
Here is my code, for some reason it isn't working when I add the easing option. It works fine with 'fade'. <script src="jquery.easing.1.3.js" type="text/javascript"></script> <script src="jquery.cycle.all.min.js" type="text/javascript"></script> <style> … >>> More
Pass easing function as variable in AS3

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi, I've been looking for some time now.. Is is possible to pass easing function as variable in AS3? eg. TweenLite.to(mcDelimiter, resizeTween, { x:(stageWidthHalf-(initStageWidthHalf-mcDelimiteri_X)), ease:Elastic.easeOut } ); TweenLite.to(mcBody, resizeTween, { x:(stageWidthHalf-(initStageWidthHalf-mcBody_X))… >>> More
Actionscript 3.0 - drag and throw with easing

as seen on Stack Overflow - Search for 'Stack Overflow'
I'm creating a map in flash and I would like to have a smooth movement similar to this: http://www.conceptm.nl/ I have made a start but I'm having trouble taking it to the next stage. My code currently throws the movieclip after the mouse is release but there is no easing while the mouse button… >>> More
online graphs of common tween / easing functions?

as seen on Stack Overflow - Search for 'Stack Overflow'
Is there an online cheat-sheet to graphs of common tween / easing functions? I want a bookmark I can refer to when picking a function for a tween (e.g., Quintic, Quadratic, "Bounce"). The only one I can do in my head easily is linear. >>> More