Welcome to Gaia! ::


it's my second project...i have to make a vertical list of buttons beside a slideshow...when the mouse pointer move over the buttons, the buttons background appear...I need to make this background move automatically with the slideshow's images toggling...I hope that i explained it well...someone help please ?
Are you having problems conceptualizing what the heck you're supposed to be doing, problems fixing code you've already written or what? For the record, we won't do your homework for you, but we can point you in the right direction if you're a bit more specific.

Also, you might consider checking out some documentation or something
kiraes
Are you having problems conceptualizing what the heck you're supposed to be doing, problems fixing code you've already written or what? For the record, we won't do your homework for you, but we can point you in the right direction if you're a bit more specific.

Also, you might consider checking out some documentation or something


I didn't ask for someone to do what i have to do...i can't even search for a lesson or any reference to tech me & i have no time.

i saw a lot of resources (plugins & codes) which helped me to make some slideshows & menus ..but i can't find anything to help me in this case.

i wasn't specific enough ?...i don't think so!..anyway..that's what i asked about :

User Image
It's still not clear what you're trying to do.

What do you mean by making the background move?
psychic stalker
It's still not clear what you're trying to do.

What do you mean by making the background move?


actually i don't know how can i explain more...but i will try again...
this list or menu is consist of 5 grey buttons
when you move your mouse pointer over each button , the blue image appear as a background of this button...& disappear & the button back to the grey color when the mouse pointer move away....i can do it easily by Html & Css....

I must use Jquery or JavaScript to make this menu more dynamic...to make this blue image shown on the top 1st button then disappear.. & appear on the 2nd button after 2 sec...& disappear again & appear on the 3rd one...etc... & back again on the 1st one...automatically.

still not clear ?
Thimo-12
psychic stalker
It's still not clear what you're trying to do.

What do you mean by making the background move?


actually i don't know how can i explain more...but i will try again...
this list or menu is consist of 5 grey buttons
when you move your mouse pointer over each button , the blue image appear as a background of this button...& disappear & the button back to the grey color when the mouse pointer move away....i can do it easily by Html & Css....

I must use Jquery or JavaScript to make this menu more dynamic...to make this blue image shown on the top 1st button then disappear.. & appear on the 2nd button after 2 sec...& disappear again & appear on the 3rd one...etc... & back again on the 1st one...automatically.

still not clear ?
This is much more clear.

To do this, you'd set up:
setInterval(function(){ toggleNextButton() ; }, 2000) ;
... And write a function that does the heavy lifting. You can even pause the interval when the user selects one by storing the return value of setInterval() and calling clearInterval() on it.

The function would probably look a little like this:
var $selectedButton = null;
var toggleNextButton = function () {
if(!$selectedButton) {
$selectedButton = $('#firstButton') ;
} else {
$selectedButton = $selectedButton.siblings($selectedButton.id()+'+.button') ;
}
$selectedButton.addClass('selected') ;
$selectedButton.siblings('.button').removeClass('selected') ;
// whatever else you need to do.
}

The general form is like this, but only the IDs and classes you use will likely differ.
psychic stalker
Thimo-12
psychic stalker
It's still not clear what you're trying to do.

What do you mean by making the background move?


actually i don't know how can i explain more...but i will try again...
this list or menu is consist of 5 grey buttons
when you move your mouse pointer over each button , the blue image appear as a background of this button...& disappear & the button back to the grey color when the mouse pointer move away....i can do it easily by Html & Css....

I must use Jquery or JavaScript to make this menu more dynamic...to make this blue image shown on the top 1st button then disappear.. & appear on the 2nd button after 2 sec...& disappear again & appear on the 3rd one...etc... & back again on the 1st one...automatically.

still not clear ?
This is much more clear.

To do this, you'd set up:
setInterval(function(){ toggleNextButton() ; }, 2000) ;
... And write a function that does the heavy lifting. You can even pause the interval when the user selects one by storing the return value of setInterval() and calling clearInterval() on it.

The function would probably look a little like this:
var $selectedButton = null;
var toggleNextButton = function () {
if(!$selectedButton) {
$selectedButton = $('#firstButton') ;
} else {
$selectedButton = $selectedButton.siblings($selectedButton.id()+'+.button') ;
}
$selectedButton.addClass('selected') ;
$selectedButton.siblings('.button').removeClass('selected') ;
// whatever else you need to do.
}

The general form is like this, but only the IDs and classes you use will likely differ.


thank you dear..i'm working with this code now...but i barely can understand some parts of it...actually my experience with Jquery isn't more than few mins of lessons...so i can't guess what do you mean with "write a function that does the heavy lifting" ...i guess that i need the full code..i'm sorry..but i have to send this page soon, so if you are ready to help it will be really appreciated.

Quick Reply

Submit
Manage Your Items
Other Stuff
Get GCash
Offers
Get Items
More Items
Where Everyone Hangs Out
Other Community Areas
Virtual Spaces
Fun Stuff
Gaia's Games
Mini-Games
Play with GCash
Play with Platinum