I need to combine two scripts! Please help :)

[M0V13574R]

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

[SparoHawk]

All you need to do is this.

From the random_imglink, replace the line:

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

With:

document.getElementById("divStayTopLeft").innerHTML = '<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" border=0></a>'

Thank should do the trick.

[M0V13574R]

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?

[SparoHawk]

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.

[M0V13574R]

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

[SparoHawk]

No. REPLACE.

FIND this line:

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

and REPLACE with this one:

document.getElementById("divStayTopLeft").innerHTML = '<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" border=0></a>'

[M0V13574R]

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.

[M0V13574R]

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!

[M0V13574R]

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

[SparoHawk]

Sure, just modify the anchor (link) tag:

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?

[M0V13574R]

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.