www.webdeveloper.com
Results 1 to 11 of 11

Thread: I need to combine two scripts! Please help :)

  1. #1
    Join Date
    May 2010
    Posts
    14

    I need to combine two scripts! Please help :)

    Ok this is the very last complicated thing I am doing for the website I am building, after this its just text and image content.

    I have two scripts - One floating image script and one random image script. I am wondering if the two can be combined to display a random image that floats on the bottom left of the screen. I have tried them both and have them working, but now I want to try and put them together (with absolutely NO knowledge whatsoever). Would someone be able to combine these for me? (I know it may be asking a lot)

    These are the two scripts:

    Floating Image -

    <script>
    if (!document.layers)
    document.write('<div id="divStayTopLeft" style="position:absolute">')
    </script>

    <layer id="divStayTopLeft">

    <!--EDIT BELOW CODE TO YOUR OWN MENU-->
    <!-- Facebook Badge START -->
    <a href="http://www.facebook.com/candykissragdolls" title="CandyKiss Ragdolls" target="_TOP"><img src="http://badge.facebook.com/badge/111402725544388.1533.1737808258.png" width="120" height="86" style="border: 0px;" /></a><!-- Facebook Badge END -->
    <!--END OF EDIT-->

    </layer>


    <p>
    <script type="text/javascript">

    /*
    Floating Menu script- Roy Whittle (http://www.javascript-fx.com/)
    Script featured on/available at http://www.dynamicdrive.com/
    This notice must stay intact for use
    */

    //Enter "frombottom" or "fromtop"
    var verticalpos="frombottom"

    if (!document.layers)
    document.write('</div>')

    function JSFX_FloatTopDiv()
    {
    var startX = 20,
    startY = 105;
    var ns = (navigator.appName.indexOf("Netscape") != -1);
    var d = document;
    function ml(id)
    {
    var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
    if(d.layers)el.style=el;
    el.sP=function(x,y){this.style.left=x;this.style.top=y;};
    el.x = startX;
    if (verticalpos=="fromtop")
    el.y = startY;
    else{
    el.y = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
    el.y -= startY;
    }
    return el;
    }
    window.stayTopLeft=function()
    {
    if (verticalpos=="fromtop"){
    var pY = ns ? pageYOffset : document.body.scrollTop;
    ftlObj.y += (pY + startY - ftlObj.y)/8;
    }
    else{
    var pY = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
    ftlObj.y += (pY - startY - ftlObj.y)/8;
    }
    ftlObj.sP(ftlObj.x, ftlObj.y);
    setTimeout("stayTopLeft()", 10);
    }
    ftlObj = ml("divStayTopLeft");
    stayTopLeft();
    }
    JSFX_FloatTopDiv();
    </script>



    And here is the Random Image script -

    <script language="JavaScript">
    <!--
    /*
    Random Image Link Script
    By Website Abstraction (http://www.wsabstract.com)
    and Java-scripts.net (http://www.java-scripts.net)
    */

    function random_imglink(){
    var myimages=new Array()
    //specify random images below. You can have as many as you wish
    myimages[1]="img1.gif"
    myimages[2]="img2.gif"
    myimages[3]="img3.gif"

    //specify corresponding links below
    var imagelinks=new Array()
    imagelinks[1]="http://www.wsabstract.com"
    imagelinks[2]="http://www.dynamicdrive.com"
    imagelinks[3]="http://www.java-scripts.net"

    var ry=Math.floor(Math.random()*myimages.length)

    if (ry==0)
    ry=1
    document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" border=0></a>')
    }

    random_imglink()
    //-->
    </script>




    Is this even doable??

    Thanks for any help in advance

  2. #2
    Join Date
    Jul 2007
    Posts
    386
    All you need to do is this.

    From the random_imglink, replace the line:
    Code:
    document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" border=0></a>')
    With:
    Code:
    document.getElementById("divStayTopLeft").innerHTML = '<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" border=0></a>'
    Thank should do the trick.

  3. #3
    Join Date
    May 2010
    Posts
    14
    Thanks SparoHawk,

    If this works, I owe you a slab (of beer that is .. not concrete LOL).

    So from what you say, the entire floating image script isnt needed except for that one line?

  4. #4
    Join Date
    Jul 2007
    Posts
    386
    No no, you replace the line I refer to with the one I proposed. Just plain old find and replace.

    Try it out and let me know.

  5. #5
    Join Date
    May 2010
    Posts
    14
    Ahh .. so I still need to have both sets of code in the body?

    Thanks mate, I will try it as soon as I get home from work. That wont be for some time though, but theres no real rush on this.

    I will let you know how it all goes

  6. #6
    Join Date
    Jul 2007
    Posts
    386
    No. REPLACE.

    FIND this line:
    Code:
    document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" border=0></a>')
    and REPLACE with this one:
    Code:
    document.getElementById("divStayTopLeft").innerHTML = '<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" border=0></a>'

  7. #7
    Join Date
    May 2010
    Posts
    14
    Hehe, yes I understand I have to replace the code with what youve supplied. I was just confirming whether I needed to have both scripts still.

    Ill try it out tonight.

  8. #8
    Join Date
    May 2010
    Posts
    14
    Ok I finally got to try and after a few goes, I discovered that you MUST use .gifs like the example says. Using .png wont work, which sucks because now it doesnt look as good.

    Got to fix the rest now - for some reason it mucked up the rest of the content.

    Thanks so much for your help SparoHawk!

  9. #9
    Join Date
    May 2010
    Posts
    14
    Sorry SparoHawk, but I have one more question (and I cant see an edit button anywhere so I have to post after my other two posts )

    I have it all working now except for one little hitch. I have this script in a framed page and currently the links are opening up the desired page in the same frame it is in. Would you know how to modify it so that the pictured link opens another webpage in a new browser window?

    Thanks for your help so far. Once this is solved I am truely done .. honest

  10. #10
    Join Date
    Jul 2007
    Posts
    386
    Sure, just modify the anchor (link) tag:
    Code:
    document.getElementById("divStayTopLeft").innerHTML = '<a href='+'"'+imagelinks[ry]+'"'+' target="_blank"><img src="'+myimages[ry]+'" border=0></a>'
    Question for you. What browser are you using to see this page you are working on?

  11. #11
    Join Date
    May 2010
    Posts
    14
    Thanks again

    I am previewing it regularly in both Firefox and IE, both latest versions. What Im doing is working quite well across both browsers. Im not too sure about Chrome though.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles