Questions tagged [slidedown]

An effect of showing element with a sliding motion.

slidedown
Filter by
Sorted by
Tagged with
61 votes
6 answers
143k views

Slidedown and slideup layout with animation

how can I display a layout in the center with slideUp when I press the button, and press again to hide ... slideDown in ANDROID help me with that, thnkss
1 vote
1 answer
44 views

Click and display child component delay/animation in React

I'm trying to create a component that, upon clicked, will display it's children component(s). I have this code: type ExpandCollapseProps = ComponentProps<"div"> & VariantProps<...
6 votes
7 answers
128k views

jQuery - Read More / Read Less. How to replace text?

HTML: <a href="#" class="show_hide" data-content="toggle-text">Read More</a> jQuery: // Slide Up Slide Down $('.show_hide').toggle(function(){ $(this).text().replace("Read More", "Read ...
1 vote
1 answer
483 views

JQuery drop down menu on hover

I have a menu with multiple links which on hover a drop down menu slides down. Each link has its own drop down. My issue is that when you call a lot of events by moving your mouse in and out of the ...
20 votes
7 answers
23k views

Cancel all queued jQuery slideUp and slideDown animations

I have an interface that makes heavy use of the jQuery slideUp and slideDown effect to expand items in a tri-state kind of way. onmouseover: function() { this.find('.details', this).slideDown(); ...
0 votes
2 answers
81 views

jQuery infinite slideUp and slideDown without clicking

I have a title that is in the h3 tag. My code works using slideUp but slideDown looks so bad. I want the slideDown animations smooth like in slideUp. Basically, slideDown from the last array to the ...
222 votes
21 answers
217k views

How to Use slideDown (or show) function on a table row?

I'm trying to add a row to a table and have that row slide into view, however the slidedown function seems to be adding a display:block style to the table row which messes up the layout. Any ideas ...
7 votes
8 answers
89k views

Slide down div on click Pure CSS?

I found this post How to create sliding DIV on click? But all the answers are Jquery methods. Is there any way to create this with PURE CSS? I have a couple other things in mind as well... What can ...
0 votes
0 answers
54 views

Jquery Slidedown() sliding down background color of other columns

I have 3 bootstrap columns with all the p content hidden using CSS display: none. I have a jQuery slidedown function that's intended to just reveal one column when the user mouses over its heading. ...
2 votes
3 answers
771 views

jQuery slidedown to not hide after click?

I have a pretty simple jQuery slidedown login. My only problem is that I would like it to not "restart" / go back up when a link anywhere on the site is clicked and/or page is refreshed, not ...
0 votes
1 answer
469 views

Jquery slidedown toggle change button text and icon when clicked

The slide down function is fine but i need to change both text and a font awesome icon in the button from 'open all questions (down icon)' to 'Close all questions (up icon)' when the button is clicked,...
0 votes
2 answers
2k views

How to make proper jQuery slide down menu ?

Hello friends! I'm having issue with slide down menu when I initially click on button(image) which is <a id="js-cat" class="js-cat"></a> it works, but it slides down and immediately ...
1 vote
2 answers
2k views

Ignore Function?

So I've got an div that slides down when you scroll near the bottom of the page. In that div, I have an "X" anchor that slides it up again (this is in jQuery). But if I scroll, the div slides down ...
11 votes
3 answers
31k views

jQuery slideDown is not smooth

I have this little jQuery slideDown effect http://jsfiddle.net/Gg4eP/2/ But the animation isn't smooth? What I am doing wrong? Thanks for your time.
0 votes
0 answers
39 views

slide down of jQuery in WordPress not works correctly

I want to slide down some Divs in WordPress using jQuery slide down. but all item come over each other. here is my code: $(".more-button").click(function(){ $("#feature-column")....
1 vote
1 answer
870 views

How to slow down dropdown box by CSS or jQuery

I have built a dropdown button,but have no idea how to slow the the dropping process: Html: <div class="dropdown"> <button onclick="myFunction()" class="dropbtn"&...
6 votes
3 answers
10k views

JQuery slideDown animation lag

My JQuery slide animation lags when sliding the #res div. Any suggestions? JQuery: $(document).ready(function(){ $('select.first').change(function(){ $(this).prop('disabled', true); var ...
6 votes
4 answers
4k views

How can I achieve a slide down effect like jQuery's slideDown, but only using CSS?

There is a problem with CSS3 animations. They do not support the "auto" height property (and width, margins, etc.). What is the best way to create a CSS3 slide down animation without knowing the ...
0 votes
2 answers
407 views

How to animate the transition in jQuery

I am using jQuery to expand increase the rows of the textarea from 1 to 4 on focus. Lets just say it is not very pleasing to the eye. I want it to slowly ease from 1 rows to 4 rows. I currently use: ...
2 votes
0 answers
183 views

Accordion animation does not work for child elements

I'm struggling with animated accordion for my site. Second level of my accordion does not have animation and is not visible. It happens only on the second level of my accordion. This animation is from ...
0 votes
0 answers
48 views

SlideUp/SlideDown dropdown value

I would like some assistance with JavaScript. I have the following dropdown: All the fields in the drop down are hard coded values with set ID fields, I would like to know if it would be possible to ...
1 vote
0 answers
35 views

CHROME: Prevent jQuery slideDown() and prependTo() from moving whole screen

I have the following code that prepends an li element to a ul list: function prependListItem(entryHTML){ $(entryHTML) .hide() .css('opacity',0.0) .prependTo('#container >...
1 vote
3 answers
2k views

Alert is not working second time when clicking on button

I am using bootstrap version so I have created a slide down menu same like below example. button not working second time <div class="alert alert-success" id="success-alert"> <button type="...
7 votes
5 answers
5k views

jQuery slideDown in IE9 - content disappears after animation finishes

I've had this problem twice on two different sites. It works in all browsers other than IE9. I have a div being opened and closed using jquery slideup and slideDown (the same problem happens with ...
4 votes
7 answers
3k views

What is the difference between JQuery's hide() and slideDown()/slideUp()?

It seems like after calling both result is the same.
2 votes
1 answer
30k views

JQuery slideDown slideUp mouseover mouseout

what I'm trying to do is to keep video in .slideDown until mouseout text AND video, is that possible? here's my code until now Both #text and #video are div JS here: <script> $(document)....
0 votes
1 answer
494 views

SlideDown event not worked in IE Browser(Version 7)

I made a site but there something wrong in IE7 I have a navigation and when I click on a li-element all the li's slideup and the matching div slidesdown. This works in all the browsers except IE7 ...
3 votes
3 answers
3k views

Mouseenter and mouseleave with animation

I make a simple mouse enter and mouse leave animation. When you mouse enter the div. Than the links div is going open. When you mouse out, the div is going closed. I set a animation with slideUp and ...
0 votes
1 answer
403 views

Jquery button triggers on any click event on whole page

This is probably a very simple question. here's my code. $( document.body ).click(function () { if ( $( ".more" ).first().is( ":hidden" ) ) { $( ".compleatelist" ).slideDown( 6000 ); } ...
0 votes
1 answer
2k views

Using React Modal with hooks: Trying to animate in mobile slide up and down. Slide up works wonderfully, but slide down style doesn't get applied

This animation portion works really well on slideUp. But the slideDown animation (close) doesn't get triggered. There is an x on the modal that closes it. Is it because of the hook? This is the second ...
1 vote
2 answers
5k views

jQuery slideDown slideUP - hide button

I am trying to write a very simple slide up and slide function that hides the buttons after they are pressed, but I have little javascript skill and am surely doing something silly. What I is not ...
0 votes
3 answers
204 views

SlideDown doesn't work with fullPage.js

guys. I got an headache trying to understand, how to fix it, but I don't know JavaScript at all. So, please, help me with it. The trouble is, that ScrollDown (maybe and Up) doesn't work, when fullPage....
1 vote
2 answers
2k views

SlideUp / SlideDown causes a jump

I am using a slideUp and slideDown JQuery slide effect on one of my webpages to get the Basic Search and Advanced Search with More/Less option. It is functioning perfectly. I am using this code. But ...
0 votes
1 answer
144 views

Animating multiple elements inside another element

So I have container and inside there is yui library with 5 divs. This divs are menus. So what i want to do is that when I move mouse over div only this one will animate UP and when I move mouse ...
-6 votes
2 answers
1k views

Slide down button to show text HTML CSS

I'm trying to make a button on my website slide down to show text, but currently it only shows the button with the text under it. The button does not do anything but click. I want the text at the ...
32 votes
6 answers
35k views

Slide down effect on ExpandableListView

Is it possible to have a nice slide up/down effect when expanding/collapsing an item of a ExpandableListView? If yes, how? Thanks in advance.
1 vote
0 answers
42 views

slideDown works, but when I change to slideUp, it stops working

I have 2 small divs, side by side in a bigger div, display flex. I want one of the small divs to appear by sliding up, and the other by sliding down. They both work fine when sliding down, but when I ...
0 votes
1 answer
308 views

Slide down and up function problem with flex: 1

$(".div3Btn").click(function() { $(".div2").show("slide", { direction: "up" }, 5000); }); .div1 { display: flex; height: 100%; flex-direction: column; background-color: #...
0 votes
1 answer
311 views

JQuery slidedown alert message disables submit button

I created a Jquery slidedown alert message that for some reason disables the Submit Button as soon as it appears. My jQuery code is working perfect until the slidedown message appears: https://...
0 votes
2 answers
234 views

jquery appearing nav from the left

I'm working on an website where I want an navigation that is coming from the left when the cursor is hovering to the left. I found 1 link that looks very close to what I want but every time I try it ...
1 vote
1 answer
36 views

jquery slidedown causing elements to simply appear

I am trying to get the slideDown() method to work, but it never seems to work for me. I can do FadeIn and FadeOut just fine. I put together some sample code to show what's happening to me: http://...
10 votes
6 answers
23k views

jQuery slideDown with set height and overflow

I have the following HTML code <div class="text">bla bla bla bla</div> <div class="button">Show</div> And the CSS .text{ height:100px; overflow:hidden; } Assume .text ...
1 vote
1 answer
460 views

Dropdown menu - slideToggle challenge

Following is my code $(document).ready(function(){ $('.submenu').hide(); $('.menu').click(function(event){ event.preventDefault(); $(this).children('.submenu').slideToggle(1000); ...
0 votes
0 answers
175 views

Jquery .slideDown() from top only

I am trying to slide a div down when a parent element is clicked. I am able to get the slide behavior, however, it not only slides from the top, it also expands from the left, so from the top-left ...
5 votes
3 answers
4k views

JQuery .slideDown() is sliding up

This works but I'm not sure why. In function capIn(), in my mind the line $botcap.slideDown("slow") should slide the div down. It slides it up. If I try using .slideUp() nothing happens as if it is ...
1 vote
1 answer
77 views

slideUp() slideDown() doesn't work properly

$(document).ready(function(){ $('.outer').click(function () { $('.inner').slideUp(); /*alert("I BIMS");*/ }); }); * { margin: 0; padding: 0; -webkit-box-sizing: border-box;...
0 votes
1 answer
797 views

Prevent Slide down on to perform some other action on mouse-wheel scroll in Fullpage js

I am using fullpage js in a website and i need to stop a particular slide to scroll down on mouse wheel scroll. Rest slides will slide normally. On 4th slide(slide in my case), i have two images which ...
0 votes
2 answers
219 views

jQuery slide down div - disappears when click on callback

I have a bit of a problem. Have done some slide down in to div of a calendar, work nice, but after I click on the arrow to change the month, whole calendar disappears. And I can't open the calendar ...
1 vote
2 answers
51 views

Prevent jQuery script from running depending on condition

I have this script which should allow slideUp/slideDown for nested ul (dropdown menu) when window is larger than 800px and disable slideUp/slideDown functionality if window's width is less than 800px ...
4 votes
1 answer
14k views

Uncaught TypeError: $(...).find(...).slideDown/slideUp is not a function [duplicate]

I have a simple image gallery where the figcaption is hidden on each image. Here is the HTML: <figure> <img src="gallery/reef2.jpg" width="400" height="285" alt="Another beautiful example ...

1
2 3 4 5
13