Menu
Umm guys i got stuck in Jquery when i was fiddling along with some animation The thing was i wanted to make a textbox appear and show the text when a button is highlighted like a gallery ummm ..... . Anyway i made halfthrough but the text is not displaying . so any help...
P.s the idea was to have a button/circle glow and a text to appear below it like when one button/circle glows an empty space below shows the text associated with it.
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
function slide()
{//slide start
$(".textHold").hide()
.delay(1000)
.queue(
function()
{//queue function start
$(".red").css(
{//css start
"background-color":"#000"
}//css end
);//css ();
$(this).dequeue();
}//queue function/\
);//queue();
$(".textHold").fadeIn(500);
$(".textr").fadeIn(500).fadeOut(5000).delay(500);
$(".textHold").fadeOut(500).delay(500);
$(".textHold")
.queue(
function ()
{
$(".red").css({"background-color":"#f00"});
$(this).dequeue();
}
)
.delay(500)
.queue(
function()
{
$(".blue").css({"background- color":"#000"});
$(this).dequeue();
}
)
.fadeIn(500);$(".text").fadeIn(500).delay(500).fadeOut(500).delay(500);
$(".textHold").fadeOut(500).delay(500);
$(".textHold").queue(
function()
{
$(".blue").css({"background-color":"#00f"});
$(this).dequeue();
}
);
}//slide() /\
setInterval(function(){slide();},500);
</script>
</head>
<body>
<div class="red">
</div>
<div class="blue">
</div>
<div class="textHold">
<span class="text">Hello blue</span>
<span class="textr">Hello Red</span>
</div>
</body>
949
It seems to me that the code to change the style for the button is under your control (not a third party code). In this case, you can trigger a JQuery custom event when button changes color. There would be a listener to this event which will according make the text appear.
See: http://www.sitepoint.com/jquery-custom-events/
171
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
