HTML Question

mav88

OSNN Addict
#1
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
 
L

Lee

Guest
#3
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>
 

Electronic Punk

willalwaysbewithyou
Staff member
Political User
#5
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.
 
L

Lee

Guest
#6
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

mav88

OSNN Addict
#8
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
 

xtweaker

Tweaking Monkey
#9
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!
 
#10
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

Latest posts

Latest profile posts

Perris Calderon wrote on Electronic Punk's profile.
Ep, glad to see you come back and tidy up...did want to ask a one day favor, I want to enhance my resume , was hoping you could make me administrator for a day, if so, take me right off since I won't be here to do anything, and don't know the slightest about the board, but it would be nice putting "served administrator osnn", if can do, THANKS

Been running around Quora lately, luv it there https://tinyurl.com/ycpxl
Electronic Punk wrote on Perris Calderon's profile.
All good still mate?
Hello, is there anybody in there? Just nod if you can hear me ...
Xie
What a long strange trip it's been. =)

Forum statistics

Threads
61,971
Messages
673,299
Members
89,016
Latest member
Poseeut