We use cookies to provide you with a better experience. If you continue to use this site, we'll assume you're happy with this. Alternatively, click here to find out how to manage these cookies

hide cookie message
Contact Forum Editor

Send an email to our Forum Editor:


PLEASE NOTE: Your name is used only to let the Forum Editor know who sent the message. Both your name and email address will not be used for any other purpose.

Tech Helproom


It's free to register, to post a question or to start / join a discussion


 

Images on mouse over


geoff47

Likes # 0

Is it possible to bring up images using mouse over rather than mouse click in NetObjects 9

I am not into coding and am just asking if pasting a bit of code into the program and altering it to suit might enable this ability.

If not, any work arounds ?

Many thanks

Like this post
Ansolan

Likes # 0

Hi

Don't know much about NetObjects but this presumably has an html/source option, or just makes and saves the files, which you can access and edit before uploading. If you are not familiar with editing the source, or don't have an editor, open the page in IE on your computer and follow >File > Edit With Notepad. Or just right click the unopened file and do the same.

Editing the source code is nothing to be too concerned about, providing you are careful. At the top of the document, you will see an area starting with <head> and ending with </head> containing various lines, title, meta tags etc. Create a fresh line and enter the code below before </head>:

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
loadImage1 = new Image();
loadImage1.src = "images/second_image.jpg";
staticImage1 = new Image();
staticImage1.src = "images/first_image.jpg";
// End -->
</script>

Then, go down to the <body> section of the page and wherever the image is currently located, you will see a tag something like:

<img src="images/your_current_image.jpg"..../>

Probably more information before the /> but in any event, just delete the whole tag and replace this with:

<a href="#" onMouseOver="image1.src=loadImage1.src;" onMouseOut="image1.src=staticImage1.src;">
<img name="image1" src="images/first_image.jpg" border=0></a>

Really depends what you are trying to do but if this is just one simple image replacement on mouseover, the above should be fine. This isn't the only way to do what you want and for much more, not the best way but is the most straightforward. A few points:

You naturally need to change first_image.jpg and second_image.jpg to suit and may need to change the path i.e. if your images are not stored in a folder called images/

The href="#"part is in case you want the image that comes up to be a link, say to another page. If not, you can leave or remove this, won't matter. If you do want the image to be a link, chnage the tag to href="your_page.html" or whatever.

You can also add styles to an a tag, which you might want to, or need to include from the existing image e.g.

<a style="border: 3px solid red;" href="#" onMouseOver="image1.src=loadImage1.src;" onMouseOut="image1.src=staticImage1.src;">
<img name="image1" src="images/chateau_guests.jpg" border=0></a>

Where style="border: 3px solid red;" would make both images show with a 3px red border.

Hope there are no errors above, looks okay and really isn't as hard to implement as may seem the case. Find the folder containing your web pages, right click and copy a page to play with, then give this a try.

Like this post
geoff47

Likes # 0

I shall have a go later, on something I can mess up and it wont matter.

It is a little intimidating to go from a simple program to code writing, as if it is magic or something.

I have looked for this sort of code but they tend to give too much information, and I get confused.
Not really understanding paths doesn't help either, but I shall take my time and give it a go.

If I manage this.......I will be flying.

Like this post

Reply to this topic

This thread has been locked.



IDG UK Sites

6 cheapest 4K TVs in the UK 2014: Get a UHD telly without breaking the bank

IDG UK Sites

Apple MacBook Air (11-inch, 256GB, Early 2014) lab tests and benchmarks

IDG UK Sites

How to stop your parents opening and responding to phishing emails

IDG UK Sites

Google to ship first Project Ara developer boards in July