Hi There

 

I'm looking for a little help on a design I have started. I have added a Lava Lamp nav to my header and when the lava lamp image is on the currant link I want the text to show a #FFF but for some reason I cant seam to do it. Maybe im having one of them days lol

 

Hope you are all well and thanks for the help. Please see the below url and remember to add the www.

 

danielwaddon.com/design

Could you try

 .lavaLampWithImage li.current a{
color:#fff;
}

That adds color #fff to the a of li.current (which background and a color are the same atm).

Hi

 

I have tried that and it don't work?

 

Thanks for the help

When I add it in Google Inspect element, it works, not sure why it doesn't work for you.

Maybe find this code:

.lavaLampWithImage li a:hover, .lavaLampWithImage li a:active, .lavaLampWithImage li a:visited {
border: none;
color: #FFF;
} 

and just add the .current li a, like this:

.lavaLampWithImage li a:hover, .lavaLampWithImage li a:active, .lavaLampWithImage li a:visited, .lavaLampWithImage li.current a{
border: none;
color: #FFF;
}

 

On a second thought - lavaLamp needs to add class .current to a li you click on and it doesn't.

Is that going to be one page website or not? If it's one page you need to add class current on click, if it's not you can add it to the relevant li on each page.

On a second thought - lavaLamp needs to add class .current to a li you click on and it doesn't.

Is that going to be one page website or not? If it's one page you need to add class current on click, if it's not you can add it to the relevant li on each page.

Yes its going to be a one page website. what one should I add then?

 

 

Edited September 1, 201312 yr by deejaydiamond

You need to use javascript to add class current to <li> on click, and remove class current from the other <li>s.

Something like this: http://jsfiddle.net/k7djW/

cool thanks for that. will it matter where I put the js $('ul.lavaLampWithImage li').click(function(){
$('ul').children().removeClass('current');
$(this).addClass('current');
});

 

?

Put it after the jQuery library, but not before

Also keep the CSS that makes the .current a white

Thanks for all the help you have been great. can you tell me something. I have put the js code in each of my js files and it don't seam to work so what am I doing wrong?

 

also the .current a white works but as soon as I roll over another link it stays white and it needs to change back to blue?

Edited September 1, 201312 yr by deejaydiamond

You need to put the js code only in your HTML file, after where you load the jQuery library, no need to put it in every js file

If it is one page site, wouldn't you need the a to stay white (as it indicates the current section user is on, e.g. Work)? Or is the lavaLamp not staying in on click (on my phone now, can't test much)?

oh I see lol. silly me and I have now added it but still don't seam to work. Also if you look at the website again I have re uploaded the new edit code.

 

In ref to the lava if you look now and roll over say project the lava works correct other the when you roll over say projects the WHAT I DO is still white and not blue making it look wrong. the nav links will all link to an anchor not that I think that matters. Also if you click one of the links the text colour should be whit and its not.

 

Thanks

Daniel

Edited September 1, 201312 yr by deejaydiamond

Anyone?

I have had a look, but have no idea why it wouldn't work on your site Lavalamp is an old plugin, the one you use works with jQuery 1.2.3

Hopefully someone with greater knowledge of js than mine could help

I have had a look, but have no idea why it wouldn't work on your site Lavalamp is an old plugin, the one you use works with jQuery 1.2.3

Hopefully someone with greater knowledge of js than mine could help

 

Ok. Thanks for all the help and info, you have been great.

 

Thanks

Daniel

Anyone with know who is good at JS?

Anyone please?