Forums

nlfatkid

I have this rollover on this site im working on: Click here and see mid way down the page.

The client now wants a default text, when not rolling over the links on the left.

This is my js:


$(document).ready(function() {
	$('input, textarea').example(function() {
 	return $(this).attr('title'); 
	});
	$('div.aside li.one span').hover(function() {
		$('div.aside li span.current').removeClass('current');
		$(this).addClass('current');
		$('div.content li.on').removeClass('on');
		$('div.content li.water').addClass('on');
	});
	$('div.aside li.two span').hover(function() {
		$('div.aside li span.current').removeClass('current');
		$(this).addClass('current');
		$('div.content li.on').removeClass('on');
		$('div.content li.land').addClass('on');
	});
	$('div.aside li.three span').hover(function() {
		$('div.aside li span.current').removeClass('current');
		$(this).addClass('current');
		$('div.content li.on').removeClass('on');
		$('div.content li.education').addClass('on');
	});
	$('div.aside li.four span').hover(function() {
		$('div.aside li span.current').removeClass('current');
		$(this).addClass('current');
		$('div.content li.on').removeClass('on');
		$('div.content li.energy').addClass('on');
	});
	$('div.aside li.five span').hover(function() {
		$('div.aside li span.current').removeClass('current');
		$(this).addClass('current');
		$('div.content li.on').removeClass('on');
		$('div.content li.work').addClass('on');
	});
	$('div.aside li.six span').hover(function() {
		$('div.aside li span.current').removeClass('current');
		$(this).addClass('current');
		$('div.content li.on').removeClass('on');
		$('div.content li.lifeskills').addClass('on');
	});
	$('div.aside li.seven span').hover(function() {
		$('div.aside li span.current').removeClass('current');
		$(this).addClass('current');
		$('div.content li.on').removeClass('on');
		$('div.content li.conservation').addClass('on');
	});
	$('div.aside li.eight span').hover(function() {
		$('div.aside li span.current').removeClass('current');
		$(this).addClass('current');
		$('div.content li.on').removeClass('on');
		$('div.content li.about').addClass('on');
	});
 });

Help?
Sorry I'm kind of a newbie to JS.

JediN1nja

I don't know if this will help, because I am pretty much a JQuery noob as well.
But if I understand you correct, try this:

$("#button").hover(function() {
				//insert hover state
			}, function() {
				//insert non-hover state
			});

nlfatkid

Hmmm... so I need to remove the current class and then add in a different div.
Not 100% sure on how to do that...

Vinnix

Hey,

So something to consider using the .each() in jQuery like

$('div.aside li').each(function(){
//Whatever code your using for each call
})

Sounds like you want a mouse out event? So if they don't select anything (or the mouse leaves) Returns to default text?

Grab the container and do a mouse Leave Event

$("div.aside").mouseleave(function(){
//Display default infomationz
});

Hope this helps

-Vinny

ps.- I'm in CO!

nlfatkid

Post moved (not answered... just yet):
http://forum.jquery.com/topic/deafult-text-w-hover

@Vinnix: danke!

treehouse : what would you like to learn today?

Forums

JS off-hover?