WebSite help!

satanswrath

New Member
My web-site is http://program4hack.awardspace.com

Can anyone help me make the 'nails' on the Bottom left and right of the picture Clickable.. and when you mouseover it, its become a menu.. The most difficulty consists of making the nail a mousover.. I really would appreciate all help! :) Thank you
 

Geodun1

New Member
I fail to see which nails you're talking about. You mean the bolts in the metal plate?

If so, you can easily use a rect to link it directly to a page. If you want a menu though, you're going to have to cut that image up into smaller images, then use javascript to drop down a menu when the mouse hovers over the bottom left/right images.

Google drop down menus, you should find plenty of scripts to do this for you.
 

satanswrath

New Member
Yes sorry,bolts.. My english isnt very good so :p
ANd yeah, I got the bolt as an image, but how do I place it just in the right place? Thats the only part im stuck on, rest is easy
 

Geodun1

New Member
First, take the height of your background and subtract the height of the bolt image, then do the same for the width. Then put in the following for your css.

Code:
.boltleft { margin-top: heightpx; margin-right: widthpx; float: left; }
.boltright { margin-top: heightpx; margin-left: widthpx; float: left; }

Then put this div into your id="background" div.

Code:
<div id="boltleft"><img src="bolt.gif" alt=" " /></div>
<div id="boltright"><img src="bolt.gif" alt=" " /></div>
 

webmasterdan

New Member
For the onMouseOver effect...

taken from: http://www.w3schools.com/jsref/jsref_onmouseover.asp

<html>
<head>
<script type="text/javascript">
function mouseOver()
{
document.b1.src ="b_blue.gif";
}
function mouseOut()
{
document.b1.src ="b_pink.gif";
}
</script>
</head><body>
<a href="http://www.w3schools.com" target="_blank"
onmouseover="mouseOver()"
onmouseout="mouseOut()">
<img border="0" alt="Visit W3Schools!"
src="b_pink.gif" name="b1" /></a>
</body>
</html>
 

twistedted

New Member
Re-due it in Flash! you can import your Photoshop file directly into flash and keep all the same layers! Select the bolt layer you want add a action to it by pressing the f6 button! Then double click on the keyframe in the layer. This will open the action layer. Then create a new layer in your actions and call it Actions. On the first keyframe on your new actions layer post this in your actions.

stop ();
this.onEnterFrame = function(){
if(rewind == true){
prevFrame();
}
}
this.onRollOver = function(){
rewind = false;
play();
}
this.onRollOut = function(){
rewind = true;
}

Go to your image layer and right click on the first keyframe and select copy. Go to keyframe 5 and past. go back to the first keyframe right click and select motion tween
go back to the 5th keyframe right click and select free transform. Hold down your shift key and drag the corner just a little bit. go to your actions layer right click and select and blank keyframe. Paste this code in your actions.

stop();
this.onRelease = function(){
var jscommand:String = "window.open('http://www.yourdomain.com/608c.pdf','win','height=1024,width=1280,toolbar=yes,scrollbars=yes');"; getURL("javascript:" + jscommand + " void(0);");
}

Where it says yourdomain put your link in there.
This is all AS2 so if you want to use AS3 let me know and I can give you the walk through for that as well. Easy and affective way to create what it is your looking for.
 
Top