Hi I'm hoping someone can help me out with a jQuery lavalamp problem.
I have the following - a menu bar using lavalamp. - a div where content is loaded into when link on menu bar is clicked - in my content div I have some links that link to the same pages as in the menu bar
The menu bar itself, looks and works great. However I wan't to be able to focus on / highlight the corresponding menu item "Menu Option" when a user clicks on one of the links within my content div.
EG
<div><ul class="lavalamp">
<li><a href="Item 1.html">item 1</a></li>
<li><a href="Item 2.html">item 2</a></li>
<li><a href="Item 3.html">item 3</a开发者_如何学C></li>
</div>
<div id="dynamic-content">
<a href="Item3.html">Item 3.html</a>
</div>
When the user clicks on item 3 within the dynamic content div the selection on the lavalamp should change.
Does anyone have any experience with this?
Thanks
I don't know which jQuery lavaLamp you are using. If you are using this one, use SimpleCoder's answer. If you are using this one, try this:
$(function() {
var loc = window.location.href;
var filename = loc.substring(loc.lastIndexOf('/')+1, loc.length);
$('.lavalamp a, #dynamic-content a').each(function(){
if ($(this).attr('href') == filename){
$(this).parent().addClass('current');
}
});
$(".lavalamp").lavaLamp({
fx: "backout",
speed: 700
})
});
To change the selection on the lavalamp, redefine the lavalamp using the lavaLamp()
function passing a startItem
parameter:
$('#myLavalamp').lavaLamp({startItem: 4});
Note that numbering starts at 0 for elements. Also, you will have to include all of your other options that you used to initialize the lavalamp originally.
$(function() {
var loc = window.location.href;
var filename = loc.substring(loc.lastIndexOf('/')+1, loc.length);
$('#2 a, #dynamic-content a').each(function(){
if ($(this).attr('href').indexOf(filename)>-1){
$(this).parent().addClass('current');
}
});
$("#2").lavaLamp({
fx: "backout",
speed: 700
})
});
精彩评论