script works IE not FireFox, help?

**markakapops** · 11-09-2009, 07:57 PM

<head>
<script type="text/javascript" language="javascript">
var wlen;
var setIntID;
setIntID = 0;
wlen = 10;
function SetitUp() {
setIntID = setInterval("Pic_load()", 1)
}

function Pic_load() {
wlen = wlen + 4;
if (wlen < 399) {
document.getElementById("pictureDiv").style.width = +wlen;
}
if (wlen > 398) {
clearInterval(setIntID);
}
}

</script>
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
<title></title>
</head>
<body >
<div id="pictureDiv" onload="Pic_load();" >
<script type="text/javascript" language="javascript">
window.onload = SetitUp();
</script>
<img alt='' src='http://www.killcravings.com/Gallery/albums/userpics/normal_DSCN1155.JPG' />

</div>

</body>

**jscheuer1** · 11-09-2009, 10:34 PM

You have invalid code and markup. Also the code is sloppy. Try:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
#pictureDiv {
 width: 10px;
}
#pictureDiv img {
 width: 100%;
}
</style>
<script type="text/javascript">
(function(){
	var wlen = 10, setIntID, picDivStyle;
	function SetitUp(){
		picDivStyle = document.getElementById('pictureDiv').style;
		setIntID = setInterval(Pic_load, 20);
	}
	function Pic_load(){
		wlen += 10;
		if (wlen < 399){
			picDivStyle.width = wlen + 'px';
		}
		else{
			picDivStyle.width = '398px';
			clearInterval(setIntID);
		}
	}
	window.onload = SetitUp;
})();
</script>
</head>
<body>
<div id="pictureDiv">
<img alt="" src="http://www.killcravings.com/Gallery/albums/userpics/normal_DSCN1155.JPG">
</div>
</body>
</html>

**markakapops** · 11-10-2009, 03:22 PM

John I am seld taught, and an old dog, I am not sure why you made the changes you made and why? Can you recommend a book or a sight that might explain these things simply? I have been using http://www.w3schools.com/ mostly. It looks like you wraped the entire thing in an empty function and )(); is at the end , and to be honest I do not have clue as to why.

**jscheuer1** · 11-10-2009, 04:29 PM

That's a self executing anonymous function. Using that in this case keeps the global scope free of our variables. This is simply good practice, as it avoids many potential conflicts with other scripts. However, it makes our variables and their values unavailable outside of the anonymous function. So for more complex code generally one variable is defined in the global scope, usually an object of some type (function, array or object), through which any required value of the code may be accessed.

I'm also self taught. Unfortunately I cannot wholeheartedly recommend any resource either online or book. One can learn a lot from various resources though. One book, by no means perfect, that I've found very helpful is:

Object-Oriented JavaScript
by: Stoyan Stefanov
publisher: PACKT

But the way you are learning is how I started out. I think I gained the most from working with existing code, tweaking it for specific purposes, and by hanging out here helping folks, rubbing elbows and sometimes even knocking heads with other coders.

There is no one way to write javascript code. But there are numerous good practices that can be incorporated into your code in various ways. And there is a tremendous amount of information on how to do this and that available, not all of which is all that well thought out nor necessarily all that current. Differences in browsers often must be taken into account, but less so once you know more of what you are doing. And it is best to have your code branch on what a browser can do, rather than on what 'make or model' it is.

**markakapops** · 11-11-2009, 03:17 PM

Thank you for taking the time to explain why you made the changes you made. I have ordered the book.
Thanks again for your help.

Thread: script works IE not FireFox, help?

Thread Tools

Search Thread

script works IE not FireFox, help?

Interesting

Bookmarks

Bookmarks

Posting Permissions