Hello can some guru be so kind to convert this to Javascript please 6

MustangManny · Oct 28, 2003

outStr = ""
randomize()
do while uBound(myPics) > 0
ranNum = fix(Rnd() * (uBound(myPics)+1))
outStr = outStr & "<img src='" & myPics(ranNum) & "' title='" & myPics(ranNum) & "'>"
resetArray(ranNum)
loop
'add remaining picture
outStr = outStr & "<img src='" & myPics(0) & "' title='" & myPics(0) & "'>"
document.getElementById("picPlace&quot

.innerHTML = outStr
end sub

sub resetArray(usedVal)
dim tempArr(), arrCount
arrCount = 0
for x = 0 to uBound(myPics)
if x <> usedVal then
redim preserve tempArr(arrCount)
tempArr(arrCount) = myPics(x)
arrCount = arrCount + 1
end if
next
redim myPics(uBound(tempArr))
for x = 0 to uBound(tempArr)
myPics(x) = tempArr(x)
next
end sub
</script>
<body onLoad="setPics()">
<div id="picPlace"></div>

Thanks in advance!

jemminger · Oct 28, 2003

try this:

Code:

<script type=&quot;text/javascript&quot;>
function setPics() {
	var myPics = [&quot;Pic1.jpg&quot;,&quot;Pic2.jpg&quot;,&quot;Pic3.jpg&quot;,&quot;Pic4.jpg&quot;,&quot;Pic5.jpg&quot;];
	var arOut = [];

	while (myPics.length > 0) {
		var ranNum = Math.round(Math.random() * (myPics.length - 1));

		arOut.push(&quot;<img src='&quot; + myPics[ranNum] +
			&quot;' title='&quot; + myPics[ranNum] +
			&quot;' alt='&quot; + myPics[ranNum] + &quot;'/>&quot;);

		myPics.splice(ranNum, 1);
	}
	document.getElementById(&quot;picPlace&quot;).innerHTML = arOut.join(&quot;&quot;);
}
</script>
<body onLoad=&quot;setPics();&quot;>
<div id=&quot;picPlace&quot;></div>

=========================================================
-jeff

http://www.jeffemminger.com

try { succeed(); } catch(E) { tryAgain(); }

Lrnmore · Oct 28, 2003

jeff,

Thanks for the array workshop, if you don't mind
could you explain why you generated the arrays
using

Code:

[,,,]

instead of (,,,) is there a difference.

Good Code!

2b||!2b

MrGreed · Oct 28, 2003

VBScript uses Parentheses () JavaScript uses Brackets []

MrGreed

http://www.pastame.com

"did you just say Minkey?, yes that's what I said."

MustangManny · Oct 28, 2003

EUREKA!!!
You are tops!!

Thank you very much!!!

onpnt · Oct 28, 2003

very nice jemminger!

_____________________________________________________________________

http://www.onpntwebdesigns.com

MustangManny · Oct 28, 2003

Okay, here's a toughie.
I have breaking my head trying to make it them rollovers and not just static images. Any chanc of that??

Thanks again.

So much amazing talent here.

jemminger · Oct 28, 2003

thanks everyone!

Lrnmore,
[] is just shorthand...i'm lazy

=========================================================
-jeff

http://www.jeffemminger.com

try { succeed(); } catch(E) { tryAgain(); }

Lrnmore · Oct 28, 2003

Very++ thin line between lazy and
smart.

2b||!2b

clarkin · Oct 28, 2003

Nice one jemminger

Pretty funky combining the randomising with the outputting of the <img tags

Randomly sorting arrays is amazingly easy, but my <img output isn't as elegant:

Code:

<script language=&quot;JavaScript&quot; type=&quot;text/javascript&quot;>
function setPics() {
	var myPics = [&quot;Pic1.jpg&quot;,&quot;Pic2.jpg&quot;,&quot;Pic3.jpg&quot;,&quot;Pic4.jpg&quot;,&quot;Pic5.jpg&quot;];
	myPics = myPics.sort(randomSort);

	var imageList =  (&quot;|&quot; + myPics.join(&quot;|&quot;)).replace(/\|(\w+\.\w+)/g, &quot;<img src='$1'>&quot;);
	document.getElementById(&quot;picPlace&quot;).innerHTML = imageList;
}
function randomSort() {
	return Math.floor(Math.random()*3)-1; //randomly -1, 0 or 1
}
</script>
</head>
<body onLoad=&quot;setPics();&quot;>
<div id=&quot;picPlace&quot;></div>

Posting code? Wrap it with code tags: [ignore]

Code:

[/ignore][code]CodeHere

[ignore][/code][/ignore].

jemminger · Oct 28, 2003

nice sort function clarkin - i haven't gotten the hang of those yet

good use of regex too!

=========================================================
-jeff

http://www.jeffemminger.com

try { succeed(); } catch(E) { tryAgain(); }

MustangManny · Oct 28, 2003

But how do you replace those pics with rollovers?

mwolf00 · Oct 29, 2003

.innerHTML = arOut.join("&quot

;
}

function newPic(inObj, inBool){
//function assumes rollover image has same name as
//original image plus "XX" at the end pic1.jpg --> pic1XX.jpg

picName = inObj.src.substr(0,inObj.src.indexOf(".&quot-1)
picExt = inObj.src.substring(inObj.src.indexOf(".&quot ,inObj.src.length)

if (inBool){
inObj.src = picName + "XX" + picExt
}
else{
inObj.src = picName.substr(0,picName.length - 2) + picExt
}
}

</script>
<body onLoad="setPics();">
<div id="picPlace"></div>

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

MustangManny · Oct 29, 2003

Awesome!!
At first I could not get it to work, just missed a bracket or two and changed some of the number in the strings subtraction:
YOU ARE BRILLIANT:

Someone please make this a TUT to post here please.

Thank you so much!!!

<script type="text/javascript">
function setPics() {
var myPics = ["Pic1.jpg","Pic2.jpg","Pic3.jpg","Pic4.jpg","Pic5.jpg"];

var arOut = [];

while (myPics.length > 0) {
var ranNum = Math.round(Math.random() * (myPics.length - 1));

arOut.push("<img src='" + myPics[ranNum] +
"' title='" + myPics[ranNum] +
"' alt='" + myPics[ranNum] + "'" +
" onMouseOver = 'newPic(this,true)' " +
" onMouseOut = 'newPic(this,false)' />&quot

;

myPics.splice(ranNum, 1);
}
document.getElementById("picPlace&quot

.innerHTML = arOut.join("&quot

;
}

function newPic(inObj, inBool){
//function assumes rollover image has same name as
//original image plus "XX" at the end pic1.jpg --> pic1XX.jpg

picName = inObj.src.substr(0,inObj.src.indexOf(".&quot

)
picExt = inObj.src.substring(inObj.src.indexOf(".&quot

,inObj.src.length)

if (inBool){
inObj.src = picName + "XX" + picExt
}
else{
inObj.src = picName.substr(0,picName.length - 2) + picExt
}
}

</script>

MustangManny · Oct 29, 2003

Oops, her eis the correct version:

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script type="text/javascript">
function setPics() {
var myPics = ["Pic1.jpg","Pic2.jpg","Pic3.jpg","Pic4.jpg","Pic5.jpg"];

var arOut = [];

while (myPics.length > 0) {
var ranNum = Math.round(Math.random() * (myPics.length - 1));

arOut.push("<img src='" + myPics[ranNum] +
"' title='" + myPics[ranNum] +
"' alt='" + myPics[ranNum] + "'" +
" onMouseOver = 'newPic(this,true)' " +
" onMouseOut = 'newPic(this,false)' />&quot

;

myPics.splice(ranNum, 1);
}
document.getElementById("picPlace&quot

.innerHTML = arOut.join("&quot

;
}

function newPic(inObj, inBool){
//function assumes rollover image has same name as
//original image plus "XX" at the end pic1.jpg --> pic1XX.jpg

picName = inObj.src.substr(0,inObj.src.indexOf(".&quot

)
picExt = inObj.src.substring(inObj.src.indexOf(".&quot

,inObj.src.length)

if (inBool){
inObj.src = picName + "XX" + picExt
}
else{
inObj.src = picName.substr(0,picName.length - 2) + picExt
}
}

</script>
</head>
<body onLoad="setPics();">
<div id="picPlace"></div>

</body>
</html>

MustangManny · Oct 29, 2003

OMG, I forgot one thing. how do you add hyperlinks to the appropriate image? An array, with 2 elements?

MustangManny · Oct 29, 2003

Okay I diddled around with my limited knowledge of Javascriot and came up with this . It works! BUT something is amiss.

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script type="text/javascript">

function setPics() {
// var newpics = new Array(5);
var myPics = new Array(5)
myPics[0] = "Pic1.jpg"
myPics[1] = "Pic2.jpg"
myPics[2] = "Pic3.jpg"
myPics[3] = "Pic4.jpg"
myPics[4] = "Pic5.jpg"
var url = new Array(5)
url[0] = "

http://www.cnn.com"

url[1] = "

http://www.billboard.com"

url[2] = "

http://www.tek-tips.com"

url[3] = "

http://www.farscape.com"

url[4] = "

http://www.yahoo.com"

var arOut = [];

while (myPics.length > 0) {
var ranNum = Math.round(Math.random() * (myPics.length - 1));

arOut.push("<a href=" + url[ranNum]+"><img src='" + myPics[ranNum] +
"' title='" + myPics[ranNum] +
"' alt='" + myPics[ranNum] + "'" +
" onMouseOver = 'newPic(this,true)' " +
" onMouseOut = 'newPic(this,false)' /></ahref><br>&quot

;

myPics.splice(ranNum, 1);
}
document.getElementById("picPlace&quot

.innerHTML = arOut.join("&quot

;
}

function newPic(inObj, inBool){
//function assumes rollover image has same name as
//original image plus "XX" at the end pic1.jpg --> pic1XX.jpg

picName = inObj.src.substr(0,inObj.src.indexOf(".&quot

)
picExt = inObj.src.substring(inObj.src.indexOf(".&quot

,inObj.src.length)

if (inBool){
inObj.src = picName + "XX" + picExt
}
else{
inObj.src = picName.substr(0,picName.length - 2) + picExt
}
}

</script>
</head>
<body onLoad="setPics();">
<div id="picPlace"></div>

</body>
</html>

clarkin · Oct 29, 2003

</ahref> should be </a>

Also you might find the shorthand way of creating an array easier:
var myPics = new Array("Pic1.jpg", "Pic2.jpg", ...)

When you add to it you just throw in some elements at the end

Posting code? Wrap it with code tags: [ignore]

Code:

[/ignore][code]CodeHere

[ignore][/code][/ignore].

Lrnmore · Oct 29, 2003

You might want to add a single ' around link url.

2b||!2b

Lrnmore · Oct 29, 2003

Sorry that was confusing.

You need to add a pair of ' one on each end of
the link url.

you want the link to look like:

("<a href='" + url[ranNum]+ "'><

2b||!2b

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Hello can some guru be so kind to convert this to Javascript please 6

MIS

Programmer

Technical User

Programmer

MIS

Programmer

MIS

Programmer

Technical User

Programmer

Programmer

MIS

Programmer

MIS

MIS

MIS

MIS

Programmer

Technical User

Technical User

Similar threads

Log in

Part and Inventory Search

Sponsor