Play SAH Search Log in Register / Forams
SUPERJER FORAMS ≡

HTML nao!

HTML nao!

if( while ) switch{ coding } ++ — Page [1]
Mate de Vita
Kelli

2008 Oct 4 • 2453
159 ₧
So, I have to make this website for school and I have something to ask.

I have a few images I'm going to turn into links to other websites. But I'd like a cloud (I have no idea what that thing is really called) to appear if a user puts the mouse over one of those images. So for example:


I'd like something like that cloud saying WWE wwe.com to appear when you hover over the picture, explaining which site the image-link will take you to (for example in the above case, I'd want the cloud to say superjer comics).
...and that's the bottom line because Mate de Vita said so.
 
 
 
≡ 2009 Dec 31 at 12:23 UTC — Ed. 2009 Dec 31 at 12:23 UTC
Down Rodeo
Cap'n Moth of the Firehouse

Find the Hole II Participation Medal
2007 Oct 19 • 5486
57,583 ₧
It's called a tool-tip. When you are writing the HTML do something like <a href="http://www.superjer.com/ic/" title="Superjer's crazy crazy comics!">Comics</a>
I give a little into the moment like I'm standing at the edge (I know)
That no-one's gonna turn me 'round
Just one more step, I could let go
 
 
 
≡ 2009 Dec 31 at 13:50 UTC — Ed. 2009 Dec 31 at 13:52 UTC
Mate de Vita
Kelli

2008 Oct 4 • 2453
159 ₧
OK, now a bigger problem. First I made the website by trying out all paddings and other in pixels.
But that will only look the same with people who have the same resolution.
So I made a new site, this time using a table with width:100% and then four times <tr style="width:25%">blah blah</tr>.


This is what it looks like.
Now I'd be quite happy to call it a day and go with a site like this (after I finish with the pictures and links) but there's one more thing I'd like to do:
how do I get the pictures and text so that they're in the center of their respective cells (either horizontally only or both, horizontally and vertically)?

This is my table code right now:

HTML code
<table border=0 cellpadding=15px cellspacing=0 style="width:100%;margin:0 auto;float:left;"> <tr> <td style="width:25%"><h2>Required Software</h2></td> <td style="width:25%"><h2>CS Mapping Tutorials</h2></a> <td style="width:25%"><h2>3D Modelling</h2></td> <td style="width:25%"><h2>Upload your maps</h2></td> </tr> <tr> <td style="width:25%"><a href='http://themightyatom.nl/hldownloads/hammer_v34.exe' title="Valve Hammer Editor 3.4"><img alt='Valve Hammer Editor' src='./Slike/VHE2.jpg' width=150 height=150></a></td> <td style="width:25%"><a href='http://www.superjer.com/learn.php' title="Superjer's CS Mapping Guide - for complete newbies"><img alt="SuperJer's CS Mapping Tutorial" src='./Slike/superjer.png' width=205 height=150></a> <td style="width:25%"><a href='http://twhl.co.za/tutorial.php?id=147' title="Rimrook's Tutorial to the basics of 3D Modelling"><img alt='Rimrook's Tutorial' src='./Slike/rimrook.png' width=150 height=150></a></td> <td style="width:25%"><a href='http://twhl.co.za/tutorial.php?id=147' title="Rimrook's Tutorial to the basics of 3D Modelling"><img alt='Rimrook's Tutorial' src='./Slike/rimrook.png' width=150 height=150></a></td> </tr> <tr> <td style="width:25%"><a href='http://themightyatom.nl/hldownloads/zhlt34x86final.zip' title="ZHLT Compilers 3.4 32-bit"><img alt='32-bit ZHLT compilers' src='./Slike/ZHLT.jpg' width=150 height=150></a><a href='http://themightyatom.nl/hldownloads/zhlt34x64final.zip' title="ZHLT Compilers 3.4 64-bit"><img alt='64-bit ZHLT compilers' src='./Slike/ZHLT2.jpg' width=150 height=150></a></td> <td style="width:25%"><a href='http://twhl.co.za/tutorial.php?cat=1' title="TWHL's extensive guide collection"><img alt="TWHL Goldsource Mapping Tutorials" src='./Slike/twhl.png' width=150 height=150></a> <td style="width:25%"><a href='http://twhl.co.za/tutorial.php?id=147&page=2' title="Rimrook's more advanced 3D Modelling Tutorial"><img alt='Rimrook's Tutorial part 2' src='./Slike/rimrook2.png' width=150 height=150></a></td> <td style="width:25%"><a href='http://twhl.co.za/tutorial.php?id=147' title="Rimrook's Tutorial to the basics of 3D Modelling"><img alt='Rimrook's Tutorial' src='./Slike/rimrook.png' width=150 height=150></a></td> </tr> <tr> <td style="width:25%"><a href='http://themightyatom.nl/hldownloads/hammer_testbuild04.zip' title="VHE 3.5 - Executable file only"><img alt='News' src='./Slike/VHE.png' width=150 height=150></a></td> <td style="width:25%"><a href='http://countermap2.com/Tutorials/index.html' title="Counter-map's guide collection"><img alt='Counter-map CS Tutorials' src='./Slike/counter-map.png' width=185 height=150></a></td> <td style="width:25%"><a href='http://www.maprookie.com/random/gmaxandsmdplugins.zip' title="GMax - Free program for 3D Modelling"><img alt='GMax' src='./Slike/gmax.jpg' width=200 height=133></a></td> <td style="width:25%"><a href='http://www.maprookie.com/random/gmaxandsmdplugins.zip' title="GMax - Free program for 3D Modelling"><img alt='GMax' src='./Slike/gmax.jpg' width=200 height=133></a></td> </tr> </table>


P.S. Yes, I copied a little bit of code from superjer's homepage ('cause I don't know html).
Hopefully this isn't copyright theft, since I'm not going to distribute it.
...and that's the bottom line because Mate de Vita said so.
 
 
 
≡ 2009 Dec 31 at 15:34 UTC — Ed. 2009 Dec 31 at 15:38 UTC
Down Rodeo
Cap'n Moth of the Firehouse

Find the Hole II Participation Medal
2007 Oct 19 • 5486
57,583 ₧
 
 
 
≡ 2009 Dec 31 at 16:40 UTC
Mate de Vita
Kelli

2008 Oct 4 • 2453
159 ₧
Well, I found a few pages saying that <td align="center"> should work, I tried it and it doesn't. I couldn't find anything on w3schools.com though.
Also I joined a help forum and some guy said that the above declaration should work. Now I sent him the html and am waiting for a response.
I'm also waiting for the admins of the w3schools forum to allow me to post.
...and that's the bottom line because Mate de Vita said so.
 
 
 
≡ 2009 Dec 31 at 19:40 UTC
SuperJer
Websiteman

2005 Mar 21 • 6666
Try:

<td style="text-align:center;">

Although what you did should work too.
 
 
 
≡ 2010 Jan 1 at 05:49 UTC
Mate de Vita
Kelli

2008 Oct 4 • 2453
159 ₧
superjer said:
Try:

<td style="text-align:center;">

Although what you did should work too.

It didn't work because I foolishly copied two lines from your code:

code
a:link,a:visited {float:left;opacity:0.2;filter:alpha(opacity=20);} a:active,a:hover {float:left;opacity:1.0;filter:alpha(opacity=100);}


You can't align something that's already floating left.

But now I deleted the floats and the images get centered properly. However I get another problem:



In this picture I put my mouse over the curved pipe. As you can see the opacity on hover isn't working properly.
(the hint brushes are supposed to be next to each other but my resolution isn't big enough for that.
If I make the pictures smaller - ctrl+mwhl down - they are next to each other and both of them have
the same opacity problem)

EDIT: nvm, got it to work with someone's help. I just had to apply the opacity to every image separately.
The problem was something with inline elements (<a> being an inline element).
...and that's the bottom line because Mate de Vita said so.
 
 
 
≡ 2010 Jan 1 at 10:43 UTC — Ed. 2010 Jan 2 at 20:21 UTC
SRAW
Rocket Man

2007 Nov 6 • 2525
601 ₧
why dont you use ms word to make the webpage then put it on a usb and then secretly upload it...
Free Steam Games
 
 
 
≡ 2010 Jan 6 at 11:21 UTC
Down Rodeo
Cap'n Moth of the Firehouse

Find the Hole II Participation Medal
2007 Oct 19 • 5486
57,583 ₧
Microsoft Word produces shoddy HTML as far as I'm aware. You need only look at Internet Explorer and the kind of code it expects to know that.
I give a little into the moment like I'm standing at the edge (I know)
That no-one's gonna turn me 'round
Just one more step, I could let go
 
 
 
≡ 2010 Jan 6 at 15:15 UTC
Page [1]