Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Oct 2006
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Javascript alert on a rollover image

    This is the problem i am having. I am trying to get javascript to popup an alert on a rollover image. Go here to see what i have for a rollover image. it's on the add to cart button. I want to have the button be the trigger for the alert, so the people will know to fill out the submit form before they can add the item to their cart.

    This is the code I have for the script to get my image to do the rollover

    Code:
    function FP_swapImg() {//v1.0
     var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array(); for(n=2; n<args.length;
     n+=2) { elm=FP_getObjectByID(args[n]); if(elm) { doc.$imgSwaps[doc.$imgSwaps.length]=elm;
     elm.$src=elm.src; elm.src=args[n+1]; } }
    }
    
    function FP_preloadImgs() {//v1.0
     var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array();
     for(var i=0; i<a.length; i++) { d.FP_imgs[i]=new Image; d.FP_imgs[i].src=a[i]; }
    }
    
    function FP_getObjectByID(id,o) {//v1.0
     var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById) el=o.getElementById(id);
     else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el) return el;
     if(o.id==id || o.name==id) return o; if(o.childNodes) c=o.childNodes; if(c)
     for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el) return el; }
     f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements;
     for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]); if(el) return el; } }
     return null;
    }
    
    function FP_swapImgRestore() {//v1.0
     var doc=document,i; if(doc.$imgSwaps) { for(i=0;i<doc.$imgSwaps.length;i++) {
      var elm=doc.$imgSwaps[i]; if(elm) { elm.src=elm.$src; elm.$src=null; } } 
      doc.$imgSwaps=null; }
    }
    This is in the body of the page

    Code:
    <Body OnLoad="FP_preloadImgs(/*url*/'images/images/add_to_cart_locked_01-over.gif'); javascript:Personalize.Customers_Name.focus()">
    And finally the part that I am sure is very wrong, but i couldn't figure out how to do it.

    Code:
    <img border="0" src="images/images/add_to_cart_locked_01.gif" width="100" height="20" id="img1" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img1',/*url*/'images/images/add_to_cart_locked_01-over.gif')"><A HREF="JavaScript: alert('Submit required information first, thank you.');"></a>
    Maybe this will help more. This is the site i am editing. http://www.alwaysinmyheartinc.com/SUB66WF2.htm
    Last edited by SipherDrakon; 10-12-2006 at 07:12 AM. Reason: added the site in question

  • #2
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    It should be
    Code:
    <A HREF="#" onclick="return false"><img border="0" src="images/images/add_to_cart_locked_01.gif" width="100" height="20" id="img1" onmouseout="FP_swapImgRestore()" onmouseover="alert('Submit required information first, thank you.');FP_swapImg(1,1,/*id*/'img1',/*url*/'images/images/add_to_cart_locked_01-over.gif')"></a>
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #3
    New to the CF scene
    Join Date
    Oct 2006
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hmmm, that wasnt quite what i was thinking. That only gives an alert when someone mousesover the image. I want it to display the rollover image, and then if you click on the displayed rollover image, then it should give the alert. How might i do that?


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •