We'd like to remind Forumites to please avoid political debate on the Forum. This is to keep it a safe and useful space for MoneySaving discussions. Threads that are - or become - political in nature may be removed in line with the Forum’s rules. Thank you for your understanding.
Help with a Java script for images
Comments
-
I've slightly amended your original test.html (see below) and added in the preloading of images (using some of the file names you were using) and the function to enlarge them. All done in the head section if you want to change it.
The layout is as per the original and using the image sizing 560x328 & 50x44 (for the thumbnails - which are no longer separate files).
See what you think. If it's not what you're after just post again in the thread and I'm sure someone will be able to help.
NB - There's a quirk with the forum that makes 'open curly bracket' appear as '!!' in messages so you'll need to change that bit in the head function.
Test2.html -
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Jessica McKeegan Photography - Indoors</title>
<meta name="description" content="Beautiful and creative photography.">
<link href="index_files/default.css" rel="stylesheet" type="text/css">
<style type="text/css">@IMPORT url("css/main.css");</style>
<SCRIPT LANGUAGE="JavaScript">
<!-- hide from none JavaScript Browsers
if (document.images)
Image1= new Image(560,328)
Image1.src = "index_files/mojave.jpg"
Image2= new Image(560,328)
Image2.src = "index_files/lotus.jpg"
Image3= new Image(560,328)
Image3.src = "index_files/lightning.jpg"
Image4= new Image(560,328)
Image4.src = "index_files/pier.jpg"
Image5= new Image(560,328)
Image5.src = "index_files/stones.jpg"
Image6= new Image(560,328)
Image6.src = "index_files/pic6.gif"
Image7= new Image(560,328)
Image7.src = "index_files/pic7.gif"
Image8= new Image(560,328)
Image8.src = "index_files/pic8.gif"
Image9= new Image(560,328)
Image9.src = "index_files/pic9.gif"
Image10= new Image(560,328)
Image10.src = "index_files/pic10.gif"
function makebig(url) !! //change to open curly bracket
document.src=url;
}
// End Hiding -->
</SCRIPT>
</head><body>
<div id="main">
<div id="top">
<div>
<p><img src="index_files/jesslogosmall.jpg" width="303" height="70"><br>
</p>
<h1>scenic</h1>
</div>
<div class="nav ln" style="left: 335px;">
<img src="index_files/title_portfolio.gif" alt="Portfolio" width="60" height="16"><br>
<a href="indoors.html">inside</a><br>
<a href="outdoors.html">scenic</a><br>
<a href="artistic.html">artistic</a><br>
<a href="events.html">events </a></div>
<div class="nav ln" style="left: 523px;">
<img src="index_files/title_info.gif" alt="Information" width="82" height="16"><br>
<a href="resources.html">about me </a><br>
<a href="services.htm">what i do </a><br>
<a href="faq.html">faq </a></div>
<div class="nav ln" style="left: 711px;">
<img src="index_files/title_connect.gif" alt="Connect" width="54" height="16"><br>
<a href="contact.html">contact me</a> <br>
<a href="ordering.htm">online ordering</a><br>
</div>
</div>
<br>
<div id="middle" style="width: 70%; position: relative;">
<img src="index_files/mojave.jpg" name="BigPic" style="border:1px solid black" width="560" height="328">
<table>
<tr>
<td>
<a onClick="makebig('index_files/mojave.jpg',0, true); return false;">
<img src="index_files/mojave.jpg" style="border:1px solid black" width="50" height="44">
</a>
</td><td>
<a onClick="makebig('index_files/lotus.jpg',1, true); return false;">
<img src="index_files/lotus.jpg" style="border:1px solid black" width="50" height="44">
</a>
</td><td>
<a onClick="makebig('index_files/lightning.jpg',2, true); return false;">
<img src="index_files/lightning.jpg" style="border:1px solid black" width="50" height="44">
</a>
</td><td>
<a onClick="makebig('index_files/pier.jpg',3, true); return false;">
<img src="index_files/pier.jpg" style="border:1px solid black" width="50" height="44">
</a>
</td>
<td>
<a onClick="makebig('index_files/stones.jpg',4, true); return false;">
<img src="index_files/stones.jpg" style="border:1px solid black" width="50" height="44">
</a>
</td>
<td>
<a onClick="makebig('index_files/pic6.gif',5, true); return false;">
<img src="index_files/pic6.gif" style="border:1px solid black" width="50" height="44">
</a>
</td><td>
<a onClick="makebig('index_files/pic7.gif',6, true); return false;">
<img src="index_files/pic7.gif" style="border:1px solid black" width="50" height="44">
</a>
</td><td>
<a onClick="makebig('index_files/pic8.gif',7, true); return false;">
<img src="index_files/pic8.gif" style="border:1px solid black" width="50" height="44">
</a>
</td><td>
<a onClick="makebig('index_files/pic9.gif',8, true); return false;">
<img src="index_files/pic9.gif" style="border:1px solid black" width="50" height="44">
</a>
</td>
<td>
<a onClick="makebig('index_files/pic10.gif',9, true); return false;">
<img src="index_files/pic10.gif" style="border:1px solid black" width="50" height="44">
</a>
</td>
</tr>
</table>
</div>
<div class="ln footer_left">
Home |
Events | Portfolio |
Resources<br>
All content copyright Jessica McKeegan Photography 2008.</div>
<div class="ln footer_right"></div>
</div>
</body></html>0 -
Hi bluboy!
Thanks very much! this is how i wanted the site originally but couldnt get it to work.
And my gf was complaining how she wanted the site the original way.
Ive uploaded it to https://www.jessicamckeegan.co.uk/index3.html
The only problem is that the thumnails arent clickable, have i done something wrong?I need a cig...
0 -
Its working! Whoop!
Thank you!
Dont happen to live in Manchester do you bluboy as i think i owe you a pint haha!I need a cig...
0 -
Too far south I'm afraid! Why do I always miss out on free beer?
I think the site looks great and the photography is superb.
You may want to change the code to display the photos in their original resolution though. The sizes I put in (560x328) are stretching them which won't show them at their best.
Good luck with the site.0 -
Im planning on doing it when my gf gets back from work :-)
she can decide on which pics she wants to use then.
thanks again bluboy!I need a cig...
0
This discussion has been closed.
Confirm your email address to Create Threads and Reply
Categories
- All Categories
- 347.9K Banking & Borrowing
- 252K Reduce Debt & Boost Income
- 452.2K Spending & Discounts
- 240.4K Work, Benefits & Business
- 616.5K Mortgages, Homes & Bills
- 175.4K Life & Family
- 253.6K Travel & Transport
- 1.5M Hobbies & Leisure
- 16K Discuss & Feedback
- 15.1K Coronavirus Support Boards