Transition on show/hide JQ
3 posters
Page 1 of 1
Transition on show/hide JQ
Hello!
So have made a simple show/hide event with JQ. Example:
Works perfectly! But I want it to have transition.
Is that even possible?
What's the best way to add it? To JQ or main code?
Tried to add it to CSS - no go.
Thank you in advance!
Forum version : #phpBB2
Position : Founder
Concerned browser(s) : Google Chrome
Who the problem concerns : Yourself
So have made a simple show/hide event with JQ. Example:
- Code:
$(document).ready(function(){
$(".mz2psl").hide();
$(".mz3psl").hide();
$(".mz1").click(function(){
$(".mz1psl").show();
$(".mz2psl").hide();
$(".mz3psl").hide();
});
});
$(document).ready(function(){
$(".mz2").click(function(){
$(".mz2psl").show();
$(".mz1psl").hide();
$(".mz3psl").hide();
});
});
$(document).ready(function(){
$(".mz3").click(function(){
$(".mz3psl").show();
$(".mz2psl").hide();
$(".mz1psl").hide();
});
});
Works perfectly! But I want it to have transition.
Is that even possible?
What's the best way to add it? To JQ or main code?
Tried to add it to CSS - no go.
Thank you in advance!
Forum version : #phpBB2
Position : Founder
Concerned browser(s) : Google Chrome
Who the problem concerns : Yourself
Last edited by Kami-sama on December 10th 2016, 11:50 am; edited 1 time in total
Re: Transition on show/hide JQ
You simply add CSS via JavaScript like this...
Or you can add the transition time in the parenthesis like this.
Means it would have a 500 milliseconds transition.
- Code:
.css('transition', '500ms');
Or you can add the transition time in the parenthesis like this.
- Code:
.show(500)
Means it would have a 500 milliseconds transition.
Re: Transition on show/hide JQ
Problem solved & topic archived.
|
Similar topics
» hide and show password
» How to show/hide who is online?
» Categories hide/show
» Show hide widget
» Sidebar hide/show
» How to show/hide who is online?
» Categories hide/show
» Show hide widget
» Sidebar hide/show
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum