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 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Jan 2003
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Problem with rollovers

    I'm having trouble with the rollover effect , or onMouseover? Sorry, but I am new to this whole javascript thing... I want to change one image [linked] to another one when the mouse is hovering over it. I've searching numourus forums and some useful info but, without much knowledge for JS I didn't know how to edit. I even tried that wipper thing here, without luck.

    Basicly what I want to do is change this to this. Thanks.

  • #2
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    10,968
    Thanks
    0
    Thanked 236 Times in 233 Posts

  • #3
    New to the CF scene
    Join Date
    Jan 2003
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yeah I know I saw that before. I tried it, but I can't figure out how to edit it. I also tried the other 'methods' in the topic but I cant get anything to work correctly...I'm guessing that that you edit these parts?:

    if (sn != "" && sn != null) {
    img.n = new Image
    img.n.src = img.src; <---here?


    ect.....

    then mabey in this area?

    function soopaSwapOn() {
    this.src = this.h.src;
    }

    function soopaSwapOff() {
    here?-->this.src = this.n.src;
    }

    function soopaSwapDown() {
    here?-->this.src = this.d.src;
    this.temp = typeof(document.onmouseup) != 'undefined' && typeof(document.onmouseup) != 'unknown' ? document.onmouseup : "";
    soopaSwapUp.img = this;
    document.onmouseup = soopaSwapUp;
    }

    function soopaSwapUp() {
    var ths = soopaSwapUp.img;
    here?-->ths.src = ths.n.src;
    if (ths.temp) document.onmouseup = ths.temp;


    Sorry, I don't really know what to do but I have an Idea. I'll try messing around with it untill someone helps me with this. Thanks for the reply.
    Last edited by New2JS; 01-11-2003 at 12:05 AM.

  • #4
    New to the CF scene
    Join Date
    Jan 2003
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts
    --bumping it to the top in hope of more replys--

    Could somebody help me this one? Why wont it work, seems like it should to me. This is the farthest I've gotten with this effect. I see the image but, then when you mouseover it takes a second then it just turns into a red x...The image links are all correct. Help needed, lol!


    <script language="JavaScript">
    var articles=new Image();
    var articles2=new Image();
    articles.src="articles.gif";
    articles2.src="rarticles.jpg";
    </script>

    <a href="index.html" onMouseOver="document.rollover.src=articles2.src"
    onMouseOut="document.rollover.src=articles.src">
    <img src="articles.gif" name="rollover" border="0">
    </a>


    Thanks...
    Last edited by New2JS; 01-11-2003 at 04:27 AM.

  • #5
    Regular Coder Skyzyx's Avatar
    Join Date
    Aug 2002
    Location
    Silicon Valley, CA
    Posts
    980
    Thanks
    0
    Thanked 0 Times in 0 Posts
    This ZIP file has a fully working page/script with images to show you how it works. You will never, ever need to modify the script file. All you do is modify the attributes of the IMG tag...

    Code:
    <img src="original.gif" hsrc="hover.gif" dsrc="down.gif" />
    Download the ZIP and read the files.
    Attached Files Attached Files

    Creator of SimplePie and Tarzan AWS, co-founder of WarpShare, co-built the Y! Messenger website, usability-focused, and an INFJ personality.


  •  

    Posting Permissions

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