Comments on: Create Featured Content Slider Using jQuery UI

By: mp

mp — Thu, 29 Oct 2009 07:00:43 +0000

What about adding a function to stop the rotation onMouseClick?

By: gkiller

gkiller — Wed, 28 Oct 2009 14:12:37 +0000

In Internet Explorer, the slider causes one of our accordion menus to slow down and have jerky movement when it is opened-closed. We also have a drop down menu that falls behind the slider causing it not to be viewable. We adjusted the z-index and for our menu, but the same behavior results.

None of the slowness occurs in Firefox or Safari…of course.

Any thoughts on this?

Thanks

By: Andrew

Andrew — Tue, 27 Oct 2009 08:33:24 +0000

This above does work, but once you click a tab it does not pause again.

What I did was wrap the “fragment” divs with a new div (#tabspanel) then assign it the CSS of “#featured .ui-tabs-panel”

I then changed this:
$(”#featured”).hover(

to this:
$(”#tabspanel”).hover(

Works perfectly! It only pauses when your mouse is over the Fragment blocks.

By: Andrew

Andrew — Tue, 27 Oct 2009 08:20:36 +0000

Advice to get the PAUSE on HOVER to work.

Insert Vernon’s code:
$(document).ready(function(){
$(“#featured”).tabs({fx:{opacity: “toggle”}}).tabs(“rotate”, 5000, true);
$(“#featured”).hover(
function() {
$(“#featured”).tabs(“rotate”,0,true);
},
function() {
$(“#featured”).tabs(“rotate”,5000,true);
}
);
});

Below the HTML of the slider.

By: TransDisplay

TransDisplay — Sat, 24 Oct 2009 10:13:55 +0000

Nice tutorial mate, i’ll try that to create a nice addons

Thanks

By: gkiller

gkiller — Wed, 21 Oct 2009 15:51:06 +0000

Really great tutorial. The only issues I am having are the following:

1. Our jQuery accordion navigation menu now has a slow jerky animation when opening/closing. Is there a way to resolve this?

2. Our primary top level navigation drop-down menus (also jQuery) fall behind the news slider. Is there a way to make the drop down menus open on top of the slider?

Thanks

By: Ben Green

Ben Green — Wed, 21 Oct 2009 09:56:15 +0000

Hi all, can someone let em know how to get two of those working on the same page? I have created a whole new HTML section, with the ID featured2, and created all the CSS for this, I have then changed the call to this, but the second one still doesnt play:
$(document).ready(function(){
$(“#featured > ul”).tabs({fx:{opacity: “toggle”}}).tabs(“rotate”, 5000, true);
$(“#featured2 > ul”).tabs({fx:{opacity: “toggle”}}).tabs(“rotate”, 5000, true);
});

By: Gie

Gie — Tue, 20 Oct 2009 06:58:20 +0000

I will implement this to my web project…, thanks a alot..

By: Nikesh ponnen

Nikesh ponnen — Mon, 19 Oct 2009 10:44:18 +0000

i am gettingsome problem with ie

http://revelomax.blogspot.com/

By: Mustafa Balaban

Mustafa Balaban — Sat, 17 Oct 2009 14:23:35 +0000

good job! =)