USING JAVA SCRIPT IN PRODUCT DESCRIPTION???

kylebassett · April 10, 2004

Hi everyone - wondering if someone can help me out! I am using a javascript for my description for each product... it works fine when i view it as a .htm file - here is the link and what it is suppost to do!

http://theonestore.hn.org/estoredev/catalog/index.htm

When I paste the code in the description field, it seems to display correct - it also does the switch - but it seems to change the link to # and displays the first screen of my store... I was wondering if someone can look at the code and let me know how to make this work - I want it to switch the picture and stay where it is...

Here is the java script I am using...

Thanks in advance everyone!!!

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>The One Clothing Company</title>

<!--

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].src = changeImages.arguments[i+1];

}

var preloadFlag = false;

function preloadImages() {

if (document.images) {

tayl01 = newImage("images/taylor01.gif");

tayl02 = newImage("images/taylor02.gif");

tayl03 = newImage("images/taylor03.gif");

preloadFlag = true;

}

// -->

</SCRIPT>

</head>

<BODY STYLE="MARGIN:0" ONLOAD="preloadImages();">

THE ONE ALLOWS YOU TO CUSTOM BUILD YOU OWN

HOODY.

CHOOSE THE STYLE THAT BEST FITS YOUR

PERSONAL STYLE...

<table border="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="16%" id="AutoNumber1" height="210">

<tr>

<td width="15%" height="208">

<A HREF="#" onClick="changeImages('preview', 'images/taylor01.gif'); return true;">

<img src="images/whiteyl01.gif" alt="" width="50" height="47" border="0"></A>

RED/WHITE

<A HREF="#" onClick="changeImages('preview', 'images/taylor03.gif'); return true;"><img src="images/tayl03.gif" alt="" width="50" height="47" border="0"></A>

GREEN/WHITE

<A HREF="#" onClick="changeImages('preview', 'images/taylor05.gif'); return true;"><img src="images/tayl05.gif" alt="" width="50" height="47" border="0"></A>

PURPLE/RED

<A HREF="#" onClick="changeImages('preview', 'images/taylor07.gif'); return true;"><img src="images/tayl07.gif" alt="" width="50" height="47" border="0"></A>

BABYBLUE/BLUE

<A HREF="#" onClick="changeImages('preview', 'images/taylor09.gif'); return true;"><img src="images/tayl09.gif" alt="" width="50" height="47" border="0"></A>

BLACK/BLACKE</td>

<td width="58%" height="208">

<A HREF="#" ONCLICK="self.close(); java script:opener.location.href=''; opener.shut=false"><img src="images/taylor01.gif" alt="" name="preview" height="234" width="175" border="0"></A></td>

<td width="79%" height="208">

YELLOW/WHITE

<A HREF="#" onClick="changeImages('preview', 'images/taylor04.gif'); return true;">

<img src="images/whiteyl04.gif" alt="" width="50" height="47" border="0"></A>

PINK/WHITE

<A HREF="#" onClick="changeImages('preview', 'images/taylor06.gif'); return true;">

<img src="images/whiteyl06.gif" alt="" width="50" height="47" border="0"></A>

BLUE/WHITE

<A HREF="#" onClick="changeImages('preview', 'images/taylor08.gif'); return true;">

<img src="images/whiteyl08.gif" alt="" width="50" height="47" border="0"></A>

MAROON/YELLOW

<A HREF="#" onClick="changeImages('preview', 'images/taylor10.gif'); return true;">

<img src="images/whiteyl010.gif" alt="" width="50" height="47" border="0"></A>

BLACK/WHITE</td>

</tr>

</table>

* PLEASE CHOOSE YOUR

OPTIONS AT THE BOTTOM OF THIS PAGE

* YOUR CUSTOM ORDER WILL

SHIP WITH-IN 2 WEEKS

* CLICK TO VIEW:

<a href="http://theonestore.hn.org/estore/hoodysizechart.gif" target="_blank">

SIZE CHART</a>

</body>

</html>

kylebassett · April 10, 2004

Sorry here is the link to java script with-in store...

http://theonestore.hn.org/estoredev/catalo...?products_id=77

April 10, 2004

firstly, you need to just add the code to change the image and the image itself not the entire html file.

then instead of using links like

<A HREF="#" onClick="changeImages('preview', ' .....

use <A HREF="java script:void(0)" onClick="ch ....

then it won't change the page.

kylebassett · April 10, 2004

http://theonestore.hn.org/estoredev/catalo...?products_id=77

Thanks for the reply - it seems to work a bit but it doesn't change the image now??

Any ideas?

Sorry not a real java script guru

Thanks

Kyle

kylebassett · April 10, 2004

i may have it...

kylebassett · April 10, 2004

http://theonestore.hn.org/estoredev/catalo...?products_id=77

ok i am confussed... i have changed the code - when you first load the page and try to switch the picture it doesn't display...

I have left the image in the bottom right with the link to # - when you click on it it takes you to the front of the store - if you click back - it then work s on the first 3 - red/white - yellow/white - green/white - but nothing after that...

i am very confussed - all hte other code seems the same but not acting the dsame...

Any java people that can help me out thanks very much!!!

kylebassett · April 10, 2004

Anyone have any ideas on this issue?

Thanks very much

Kyle

January 30, 2005

Kyle,

Your script is awesome!

Can you post the working script please?

You found a great solution to the lack of product attributes control in osc.

It would be great to have the images change when the option was selected, wouldn't it?

I'll try it your way, if you would please update this thread!

Any one else with suggestions on how to make the option change active, please also post!

:-j.

USING JAVA SCRIPT IN PRODUCT DESCRIPTION???

Recommended Posts

kylebassett

kylebassett

Guest

kylebassett

kylebassett

kylebassett

kylebassett

Guest

Archived

Browse

Activity