homepage Welcome to WebmasterWorld Guest from 54.226.10.234
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / WebmasterWorld / New To Web Development
Forum Library, Charter, Moderators: brotherhood of lan & mack

New To Web Development Forum

    
Adobe Imageready HTML and Javascript code
Flolondon

10+ Year Member



 
Msg#: 431 posted 5:20 pm on Mar 23, 2003 (gmt 0)

Ok, I have created my button and done the necessary rollover effect with it in adobe photoshop and I have the javascript code and the HTML code - but the problem is How do I put all about 4-5 other button codes to together. Do I copy and paste the whole script 4-5 times or just put the button image link somewhere. Please somebody help!

Flo from London

<HTML>
<HEAD>
<TITLE>careerinprogramming</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
<!-- ImageReady Preload Script (careerinprogramming.html) -->
<SCRIPT TYPE="text/javascript">
<!--

function newImage(arg) {
if (document.images) {
rslt = new Image();
rslt.src = arg;
return rslt;
}
}

function changeImages() {
if (document.images && (preloadFlag == true)) {
for (var i=0; i<changeImages.arguments.length; i+=2) {
document[changeImages.arguments[i]].src = changeImages.arguments[i+1];
}
}
}

var preloadFlag = false;
function preloadImages() {
if (document.images) {
careerinprogramming_01_over = newImage("images/careerinprogramming_01-over.gif");
preloadFlag = true;
}
}

// -->
</SCRIPT>
<!-- End Preload Script -->
</HEAD>
<BODY BGCOLOR=#FFFFFF LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0 ONLOAD="preloadImages();">
<!-- ImageReady Slices (careerinprogramming.html) -->
<A HREF="#"
ONMOUSEOVER="changeImages('careerinprogramming_01', 'images/careerinprogramming_01-over.gif'); return true;"
ONMOUSEOUT="changeImages('careerinprogramming_01', 'images/careerinprogramming_01.gif'); return true;">
<IMG NAME="careerinprogramming_01" SRC="images/careerinprogramming_01.gif" WIDTH=400 HEIGHT=400 BORDER=0 ALT=""></A>
<!-- End ImageReady Slices -->
</BODY>
</HTML>

 

jatar_k

WebmasterWorld Administrator jatar_k us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 431 posted 12:49 am on Mar 26, 2003 (gmt 0)

It looks like your changeImages function is set up right. You would need to add a line for each image in the preloadImages function.

under this line in preloadImages
careerinprogramming_01_over = newImage("images/careerinprogramming_01-over.gif");

you add a similar line for the rollover image of each image you add to the page for example, if there are 4 total they could look like this
careerinprogramming_01_over = newImage("images/careerinprogramming_01-over.gif");
careerinprogramming_02_over = newImage("images/careerinprogramming_02-over.gif");
careerinprogramming_03_over = newImage("images/careerinprogramming_03-over.gif");
careerinprogramming_04_over = newImage("images/careerinprogramming_04-over.gif");

this is assuming the images are named accordingly, with only the number changing on each one.

The same applies to the image tag, repeat the existing one and change the numbers to 1,2,3,4.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / WebmasterWorld / New To Web Development
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved