View Full Version : Mouseover on add to basket button
Louise West
28-Jul-2003, 11:06 AM
Hi all,
Is it possible to have a mouseover image on a customised add to basket button image?.
Thanks.
cdicken
29-Jul-2003, 02:24 PM
I'm not sure it is possible. The add to cart button does not use
<img src=...>
it uses
<input type="image" src=...>
and I don't know whether the default rollover javascript will work for it.
Maybe there is a Java Script expert knocking around out there who can confirm or deny what I just said.
bangers
30-Jul-2003, 12:55 PM
shouldn't be a problem.
below is the code I've used in the input tag of Act_CartButtonImage.html
<INPUT SRC="../images/but_buy1.gif" NAME="NETQUOTEVAR:BUTTONNAME"
BORDER="0" type="image" value="send" onMouseOver="MM_swapImage('NETQUOTEVAR:BUTTONNAME','','../images/but_buy2.gif',1)" onMouseOut="MM_swapImage('NETQUOTEVAR:BUTTONNAME','','../images/but_buy1.gif',1)" alt="submit" >
I found it easier to hard code where to find the images rather than use NETQUOTEVARS.
Also remember if you haven't used rollovers on your pages before that you might have to hard code the javascript below inbetween your <head> tags (also good to preload 2nd image in the body tag). Don't quote me on that, CDicken will be better placed to answer this.
When you come to upload you get a couple of warning messages but just click O.K as it doesn't effect the site in anyway.
All the best
Bangers
javascript to place between head tags>>
<script language="JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.0
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && document.getElementById) x=document.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
bangers
19-May-2005, 11:10 AM
Forget my old reply - this is much easier:
In Act_CartButtonImage.html
<INPUT TYPE="IMAGE" SRC="NETQUOTEVAR:BUTTONIMG" NAME="NETQUOTEVAR:BUTTONNAME"
WIDTH="" HEIGHT="" BORDER="0" onmouseover="this.src='yourrolloverimage.jpg'"
onmouseout="this.src='NETQUOTEVAR:BUTTONIMG'">
Keep in mind the up state of the button is the cartimage you define within Actinic, all you need to do is add the path to you but over image
regards
Bangers
Louise West
19-May-2005, 12:09 PM
Thanks for that bangers it could come in useful and a lot shorter to code.
vBulletin® v3.8.4, Copyright ©2000-2012, Jelsoft Enterprises Ltd.