• Howdy! Welcome to our community of more than 130.000 members devoted to web hosting. This is a great place to get special offers from web hosts and post your own requests or ads. To start posting sign up here. Cheers! /Peo, FreeWebSpace.net
managed wordpress hosting

html help for a n00b... :)

AMC

AMC

serial slacker
NLC
Hey,

This is a question for all you html experts. I just got into raw html editing, and when writing marque tags i noticed you can edit the behavior of an object according to the position of the mouse in relation to it.

the code was something like mouseover:eek:n or something.:confused4

anyway i was wondering if you could do this with images. so an image is on the page, and when your mouse hovers over it it changes to another image. This would be really useful for a particular button bar i am trying to make. i heard someone call them roll overs but like i say, Im a real nobody at raw code editing
so, does anyone know what i mean??

thanks:knockedou
 
Usually it's better to use javascripts for it, there are other ways, but look into that.
What are you using to design your pages?
 
HTML: 
<img src="image.gif" id="image1" onmouseover="document['image1'].src='image2.gif';" onmouseout="document['image1'].src='image.gif';" >

<img src="pic.gif" id="image2" onmouseover="document['image2'].src='pic2.gif';" onmouseout="document['image2'].src='pic.gif';" >

Or, if you use CSS:
HTML: 
.image {
width: 400px;
height: 400px;
background-image: url("blah.gif");
background-repeat: no-repeat;
}
.image:hover {
background-image: url("blah2.gif");
}
HTML: 
<div class="image">&nbsp;</div>
 
Last edited:
You can google all this. Don't be lazy, your search will get you a lot more new stuff. GL
 
I usually do search for this sort of stuff, but very seldom do i find a good tutorial for nobodys.

Thanks for all you help though, and i use pspad editor, as i find it to be more user friendly than just plain notepad.

like i said im doing purely raw text coding :)
 
In fact, someone ought to set up a web tutorial, wikipedia, like upload the script to a site, and let people submit their own tutorials. Each tutorial would be approved by a group of about 3 mods, then submitted. Then users would gain rep from each user who said their tutorials were helpful.
 
Do you mean like this? We currently use this on our forum header etc.

Code: 
<td bgcolor="#FFFFFF"><a href="#"
			    onClick="MM_goToURL('parent','http://www.kwix-host.com/index.html');return document.MM_returnValue"
				onMouseOver="window.status='about us'; changeImages('about_us', 'images/about-us.gif'); return true;"
				onMouseOut="window.status=''; changeImages('about_us', 'images/about-us.gif'); return true;"> <img src="http://www.kwix-host.com/images/about-us.gif" alt="about us" name="about_us" width=108 height=43 border=0></a><a href="#"
 
I think that was what i was originally reffering to, yeah,
I am getting more and more into this idea of a
comprehensive tutorial site, we could have seperate levels
of tutorial - like advanced, intermediate and just getting started.

We would also have a community, for webmaster resources, and IT discussion.

Does anyone feel like doing this with me, ill do it just as soon as college ends, on the 13th, i was thinking tutorialwebs.net or something.

So does anyonewant to help??

I we could aslo charge coder and freelance designers to advertise their services? iv also got a couple of ideas for getting off of the ground.
 
Cool, I'll pm you the details of my idea, and you tell me what you like and dont like, and what you think we should do =)
 
Sadly i cant use MSN at the mo, but i will be able to on the 13th, my comp is getting fixed, when i get home.

sent you a PM though...
 
Oh yeah, i did, im making the rest of that template now, i actually really like it, it looks a tiny bit like the IPS website.

I actually find i really enjoy pure text coding , as long as you dontlet it daunt you, it is so much less constrictive than some of the programs you can buy. It is important to have a decent editor, and for those of you that may hve tried it, pspad is brilliant.
 
ok, so i cam to recode using the css, and i made a page like the one below, i put it all on the one html page for the purpose of this question

<title></title>
<STYLE type="text/css"><!--
.image {
width: 122px;
height: 40px;
background-image: url("http://i46.photobucket.com/albums/f132/shadowmaster4161/buttonnothoverimg.gif");
background-repeat: no-repeat;
}
.image:hover {
background-image: url("http://i46.photobucket.com/albums/f132/shadowmaster4161/buttonhoverimg.gif");
}--></STYLE>
</head>
<body>

<div class="image">home</div>
Click to expand...


but when i preview this code in the browser, it doesnt seem to work, please help me someone, im a reall css newbie and im trying to get better, but i cant see where i went wrong. could someone tell me how i edit the above code in order to work it :)
 
That´s what <I> call courage. remember the zx spectrum high language basic?

I just wa´na say that one day maybe the <matrix> takes over us. continue
 
What ??? ... Im sorry, but that made no sense to me :S:p All i have done is add some images to a piece of code provided earlier in this thread, and added it to the html page in order to make it easier for someone to view and therefore tell me what is wrong, the above is of course just an extract, but its fairly obvious to see where it fits in,

so does anyone have any answers :)
 
CSS is pretty easy but an arse if your doing tables. what exactly do you want? Java, HTML or CSS?
 
You must log in or register to reply here.
Back
Top