jQuery Slide toggle and fade in issue

0 votes

As you can see when clicking on a number, the title fades in alright but the text just appears below instead of sliding into place. When closing however, the text slides back perfectly. I understand this may be a weird technicality due to the fade in and slide toggle being related.

JQUERY

$(document).ready(function(){
$(".revealHeader").click(function(){
      $(".revealTitle", this).fadeIn("fast");
      $(this).nextAll(".revealText").first().slideToggle();
});
});

HTML

<div id="reveal">
<span class="revealHeader">10. <span class="revealTitle">EXAMPLE</span></span>
<span class="revealText"><img src="EXAMPLE.JPG" /></span>

Please be aware I am terrible with jQuery as I stupidly never bothered to learn it properly. (Feel free to tear apart my code.)

Jul 28, 2022 in Web Development by gaurav
• 23,260 points
652 views

No answer to this question. Be the first to respond.

Your answer

Your name to display (optional):
Privacy: Your email address will only be used for sending these notifications.

Related Questions In Web Development

0 votes
1 answer

How to Fade In/Out multiple texts using CSS/jQuery like on Droplr?

The jQuery fadeIn() method is used to ...READ MORE

answered Jun 29, 2022 in Web Development by rajatha
• 7,680 points
1,431 views
0 votes
0 answers
0 votes
0 answers

jquery virtual keyboard - Curser not blinking in Chrome and Edge

I used the jQuery virtual keyboard, but ...READ MORE

Jul 26, 2022 in Web Development by gaurav
• 23,260 points
355 views
0 votes
0 answers

Javascript/jQuery - Display inches in feet and inches

I'm making a BMI calculator (see JSFiddle ...READ MORE

Jul 29, 2022 in Web Development by gaurav
• 23,260 points
549 views
0 votes
0 answers

jQuery fade out then fade in

There's a bunch on this topic, but ...READ MORE

Jul 29, 2022 in Web Development by gaurav
• 23,260 points
840 views
0 votes
1 answer

how to rotate image image 3d in jquery on swipe up and swipe down

If you're not using one of the ...READ MORE

answered Aug 4, 2022 in Web Development by rajatha
• 7,680 points
1,948 views
0 votes
1 answer

What is jQuery?

Hey, jQuery is a fast and concise JavaScript ...READ MORE

answered Feb 14, 2020 in JQuery by kartik
• 37,520 points
1,316 views
0 votes
1 answer

Uncaught TypeError: Cannot read property 'msie' of undefined - jQuery tools

Hello, Use the following script tag in your ...READ MORE

answered Apr 28, 2020 in JQuery by Niroj
• 82,840 points
15,711 views
0 votes
1 answer

Uncaught Error: Bootstrap's JavaScript requires jQuery

Hello @kartik, You have provided wrong order for ...READ MORE

answered Apr 28, 2020 in JQuery by Niroj
• 82,840 points
23,295 views
0 votes
1 answer

How to make Bootstrap popover Appear/Disappear on hover instead of click?

Hello @kartik, Set the trigger option of the popover to hover instead ...READ MORE

answered May 12, 2020 in JQuery by Niroj
• 82,840 points
3,313 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP