HTML Question

mav88

OSNN Addict
Joined
5 Aug 2004
Messages
64
OK so i have got to design a web site which i have already done, and i have started linking pages etc, and its looking rather nice, even tho i say so myself! Well heres the question. I want to be able to have a few small thumb nail images that act as menu buttons, just a static image, not even a gif or rollover required so thats easy. I want to be able tho to do the following ... when the user puts the pointer over the small thumnail i want a larger pic and or some information to come up on another part of the browser, ie. the name of the image and when it was made etc. So its a rollover event basiclly that loads an image. Now in flash i could do this with my eyes closed, however the site needs to be all HTML!! I presume i will need java script maybe or something however im a little lost ....

All help will be appricated. ta
 
Are you talking about a tooltip that shows images size/name/last modified etc [16.6k - image.gif - 19.02.05] style thing?
 
is this what you mean?

Code:
<script>
var box;
function showBox(e, boxID) {
   var Ypos;
   var Xpos;
   if (document.all)  {
	   box = eval('document.all.' + boxID);
	   Xpos = window.event.x;
	   Ypos = window.event.y;
   }
   else if (document.getElementById)  {
	   box = document.getElementById(boxID);
	   Xpos = e.clientX;
	   Ypos = e.clientY;
   }
   box.style.visibility = 'visible';
   box.style.left= Xpos + 10 + 'px';
   box.style.top= Ypos  + 20 + 'px';
}
function hideBox(){
   box.style.visibility = 'hidden';
}
</script>
<style type='text/css'>
   .tooltip {font-family:verdana;font-size: 11px;padding: 0px;}
</style>
<BODY oncontextmenu='return false;' >

<div id='box1' class='tooltip' style='position:absolute; width:150; height:75; background-color:#FFFFFF; border:1px solid black; visibility:hidden; text-align:left;border-bottom:3px solid black;border-right:3px solid black;'><div style='border-bottom:1px black solid; font-weight:bold; padding-left:2px; padding-right:2px; text-align:Left'>Tool Tip</div><div style='padding:3px;font-family:Arial; font-size:12pt; color:#000000'>Tool Tip</div></div><span onmouseMOVE='showBox(event, "box1");' onmouseout='hideBox()'>Tips</span>
</td></tr></table>
 
See if you can find an example of what you are after, I did have an idea in my head of what Lee has copiued in, but reading it again, does look like xtweakers eg.

Trying to think of a site where I have seen a really neat mouse over effect, may well have used javascript similar to:

http://www.alexa.com/search?q=osnn

Let the page load and over "Site Info <img>" an info menu should appear.
 
Electronic Punk said:
See if you can find an example of what you are after, I did have an idea in my head of what Lee has copiued in, but reading it again, does look like xtweakers eg.

Trying to think of a site where I have seen a really neat mouse over effect, may well have used javascript similar to:

http://www.alexa.com/search?q=osnn

Let the page load and over "Site Info <img>" an info menu should appear.

see here unzip rar
 

Attachments

  • tool.rar
    694 bytes · Views: 58
Will check it out when I get home, still at work so can't download archives.
 
Thanks for all the replys guys, xtweaker came up with the solution, but all ur help has been valuable. One other question, how do u make a pop up window "pop up" when u click on a link, however tho rather that it be a random sized or maximised internet explorer window how can i set specific size property and center it on the screen? Also how can it be done to load an image when a forward button is pressed, rather that telling it to open up a new *.htm file? So that images in a specific section (i.e photograhy, cg, animation etc) can be loaded when the forward buttons clicked. Im really cack on all this sort of stuff! Im doing a portfolio web site and i want a button to be pressed and then a small window say 320x240 comes up with the higher res image that they have clicked, and then a button which keeps the same window open and just loads in a new image to cycle through some pics and the load up the first one again in a sort of loop.

Sorry for the length and complexity of the thread

Thx
 
mav88 said:
Thanks for all the replys guys, xtweaker came up with the solution, but all ur help has been valuable. One other question, how do u make a pop up window "pop up" when u click on a link, however tho rather that it be a random sized or maximised internet explorer window how can i set specific size property and center it on the screen? Also how can it be done to load an image when a forward button is pressed, rather that telling it to open up a new *.htm file? So that images in a specific section (i.e photograhy, cg, animation etc) can be loaded when the forward buttons clicked. Im really cack on all this sort of stuff! Im doing a portfolio web site and i want a button to be pressed and then a small window say 320x240 comes up with the higher res image that they have clicked, and then a button which keeps the same window open and just loads in a new image to cycle through some pics and the load up the first one again in a sort of loop.

Sorry for the length and complexity of the thread

Thx

You'd have to use the Javscript Window.Open function for this. Look at this http://www.javascript-coder.com/window-popup/javascript-window-open.phtml

It explains it well. I strongly suggest that you go on and read a few simple Javascript tutorials that explain the basics, you'll need it. All you want to do is relatively easy stuff, you just need to know the syntax. I'm sure you can manage ;)

Glad I could help!
 
Cheers for the help, i can understand the code when its infront of me, i just carnt write it myslef. Oh well one more night on this and i hopefully should be done. Thx again
 

Members online

No members online now.

Latest profile posts

Also Hi EP and people. I found this place again while looking through a oooollllllldddd backup. I have filled over 10TB and was looking at my collection of antiques. Any bids on the 500Mhz Win 95 fix?
Any of the SP crew still out there?
Xie wrote on Electronic Punk's profile.
Impressed you have kept this alive this long EP! So many sites have come and gone. :(

Just did some crude math and I apparently joined almost 18yrs ago, how is that possible???
hello peeps... is been some time since i last came here.
Electronic Punk wrote on Sazar's profile.
Rest in peace my friend, been trying to find you and finally did in the worst way imaginable.

Forum statistics

Threads
62,015
Messages
673,494
Members
5,621
Latest member
naeemsafi
Back