Image crawler problems in internet explorer

**andrewjaybecker** · 10-15-2009, 06:55 PM

1) Script Title: IMAGE CRAWLER

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...wler/index.htm

3) Describe problem: The image crawler works fine on safari and mozilla but when i open the page in IE the crawler changes position on the pages and expands past it's pre-described boundaries.

HERE IS THE SITE : http://www.tecny.com/
When you open in safari or mozilla and click on "residential", "commercial" or "press" the crawler displays correctly. In IE the crawler changes position on the pages and expands to the full width of the window

any help would be so appreciated
thank you
Andrew
andrewjaybecker@gmail.com

**jscheuer1** · 10-15-2009, 07:37 PM

I don't see any of those options on that page.

**andrewjaybecker** · 10-15-2009, 11:39 PM

sorry, that was the home page you have to click it then it takes you to
...

http://www.tecny.com/residential.html

this is the page that has the crawler on it

**jscheuer1** · 10-16-2009, 03:41 AM

That page is a mess:

On that page you have:

Code:

<script type="text/javascript">
marqueeInit({
	uniqueid: 'mycrawler',
	style: {
		'margin': '100px',
		'width': '900px',
		'background': 'white',
		
	},
	inc:  10, //speed - pixel increment for each iteration of this marquee's movement
	mouse: 'cursor driven', //mouseover behavior ('pause' 'cursor driven' or false)
	moveatleast: 1,
	neutral: 535,
	savedirection: false
});
</script>

which doesn't correspond to any crawler markup on that page, get rid of it.

That leaves (as far as code to init a crawler goes):

Code:

<script type="text/javascript">
marqueeInit({
	uniqueid: 'mycrawler2',
	style: {
		'padding': '100px',
		'width': '1300px',
		'height': '180px'
	},
	inc: 5, //speed - pixel increment for each iteration of this marquee's movement
	mouse: 'cursor driven', //mouseover behavior ('pause' 'cursor driven' or false)
	moveatleast: 2,
	neutral: 150,
	savedirection: true
});
</script>

Notice the highlighted width setting. The crawler is that wide in IE, so I don't really see any issue for IE as far as the width goes. Some other browsers are not even displaying the marquee's images (Safari 3 Win and Firefox 3 Win). I'm not certain why that is. Opera does seem to come closest to what I imagine is the intended display, but I have no idea why, in essence it should not. I can tell you that the page is invalid (don't get scared - just means that it doesn't follow standards). It has no DOCTYPE, encoding or opening HTML tag, which are either required (opening HTML tag) or recommended (encoding and DOCTYPE). And there are other validation problems with the page.

See the validator for more info on this:

http://validator.w3.org/check?uri=ht...Inline&group=0

You really need to have a valid page before we can sort this out. I tried in a local mock up in which I made the markup valid, but it crashes Firefox - There must be some other issue(s). But sometimes local mock ups fail simply because they are mock ups. I'll play with it a bit more when I have time. I'm thinking your script file may have issues, perhaps even related to the server. But I'm really at a loss at this point.

**andrewjaybecker** · 10-16-2009, 03:54 AM

thanks so much for your reply
ill try to digest it

**jscheuer1** · 10-16-2009, 04:10 AM

OK, I figured out the main problem in Firefox and others that weren't showing the images. You used (or the server substituted for some reason) \ instead of / in portions of the paths. There were many other problems, such that I wasn't able to really tell what you were exactly shooting for. There was an issue in IE in that padding applied to the marquee was:

Code:

marqueeInit({
	uniqueid: 'mycrawler2',
	style: {
		'padding': '100px',
		'width': '1300px',
		'height': '180px'
	},
	inc: 5, //speed - pixel inc

That adds (in IE, not others - due to a different way IE views padding and widths) 100px left and right above and beyond the page/container width. The marqueee will attempt to resize itself to the available width if its width is set greater than what is available.

Anyways, this is a valid workable version:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>TECNY GROUP INC. RESIDENTIAL</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="style.css">
<script type="text/javascript" src="crawler.js">
/*
Text and/or Image Crawler Script ©2009 John Davenport Scheuer
as first seen in http://www.dynamicdrive.com/forums/ username: jscheuer1
This Notice Must Remain for Legal Use
*/
</script>
</head>
<body>

	<div>
	<a href="home.html">
    <img src="images/logo.gif" border="0" alt="">
	</a>
    </div>


<div class="marquee" id="mycrawler2">

<a href="R1 Carnegie Hill Townhouse.html"><img src="photos/residential/residential_01.gif" alt="Carnegie Hill Townhouse" border="0"></a> 

<a href="R2 West 72nd St Residence 2.html"><img src="photos/residential/residential_02.gif" alt="West 72nd St Residence 2" border="0"></a> 

<a href="R3 House in Columbia County NY.html"><img src="photos/residential/residential_03.gif" alt="House in Columbia County NY" border="0"></a> 

<a href="R4 Midtown East Multi-use Building.html"><img src="photos/residential/residential_04.gif" alt="Midtown East Multi-use Building" border="0"></a> 

<a href="R5 Upper Eastside Multi-use Building.html"><img src="photos/residential/residential_05.gif" alt="Upper Eastside Multi-use Building" border="0"></a> 

<a href="R6 Upper Eastside Townhouse 2.html"><img src="photos/residential/residential_06.gif" alt="Upper Eastside Townhouse 2" border="0"></a> 

<a href="R7 Upper Eastside Mansion.html"><img src="photos/residential/residential_07.gif" alt="Upper Eastside Mansion" border="0"></a> 

<a href="R8 East 94 St Residence.html"><img src="photos/residential/residential_08.gif" alt="East 94 St Residence" border="0"></a> 

<a href="R9 Upper Eastside Townhouse 1.html"><img src="photos/residential/residential_09.gif" alt="Upper Eastside Townhouse 1" border="0"></a>

<a href="R10 East 86th Street Residence 2.html"><img src="photos/residential/residential_10.gif" alt="East 86th Street Residence 2" border="0"></a>

<a href="R11 Park Ave Residence.html"><img src="photos/residential/residential_11.gif" alt="Park Ave Residence" border="0"></a>

<a href="R12 Central Park West Residence.html"><img src="photos/residential/residential_12.gif" alt="Central Park West Residence" border="0"></a>

<a href="R13 Beach Street Loft.html"><img src="photos/residential/residential_13.gif" alt="Beach Street Loft" border="0"></a>

<a href="R14 East 86th Street Residence 1.html"><img src="photos/residential/residential_14.gif" alt="East 86th Street Residence 1" border="0"></a>

<a href="R15 House in Stonington CT.html"><img src="photos/residential/residential_15.gif" alt="House in Stonington CT" border="0"></a>

<a href="R16 House in Mamaroneck NY.html"><img src="photos/residential/residential_16.gif" alt="House in Mamaroneck NY" border="0"></a>

<a href="R17 Park Avenue South Residence.html"><img src="photos/residential/residential_17.gif" alt="Park Avenue South Residence" border="0"></a>

<a href="R18 Residence at Dakota.html"><img src="photos/residential/residential_18.gif" alt="Residence at Dakota" border="0"></a>

</div>

<script type="text/javascript">
marqueeInit({
	uniqueid: 'mycrawler2',
	style: {
		'padding': '100px 0',
		'width': '100%',
		'height': '180px'
	},
	inc: 5, //speed - pixel increment for each iteration of this marquee's movement
	mouse: 'cursor driven', //mouseover behavior ('pause' 'cursor driven' or false)
	moveatleast: 2,
	neutral: 150,
	savedirection: true
});
</script>

<div>

<a href="about.html">ABOUT</a>
<br>
<a href="residential.html"><font color="#333">RESIDENTIAL</font></a>
<br>
<a href="commercial.html">COMMERCIAL</a>
<br>
<a href="retail.html">RETAIL</a>
<br>
<a href="installations.html">INSTALLATIONS</a>
<br>
<a href="press.html">PRESS</a>
<br>
<a href="contact.html">CONTACT</a>
</div>
</body>
</html>

**richter** · 03-24-2010, 09:01 AM

Hello Mr. jscheuer1

May be you know IE problem, pictures not show.
I was open http://eyewearconnection.com/product_info.php?products_id=13677 in all browser, but only IE don't show pictures. And i can't find what the problem... ?

**jscheuer1** · 03-24-2010, 10:38 AM

Originally Posted by richter

Hello Mr. jscheuer1

May be you know IE problem, pictures not show.
in all browser, but only IE don't show pictures. And i can't find what the problem... ?

Use a valid URL DOCTYPE like:

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

That will fix it for IE 8. For other IE versions, move this:

Code:

						<script type="text/javascript">
						marqueeInit({
							uniqueid: 'mycrawler2',
							style: {
								'padding': '2px',
								'width': '750px',
								'height': '60px'
							},
							inc: 5, //speed - pixel increment for each iteration of this marquee's movement
							mouse: 'cursor driven', //mouseover behavior ('pause' 'cursor driven' or false)
							moveatleast: 2,
							neutral: 150,
							savedirection: true
						});
						</script>

to the very last thing, right before your closing </body> tag.

**richter** · 03-24-2010, 10:58 AM

Thank so mach!!!
God luck!

**tolinho** · 10-12-2010, 05:29 PM

Originally Posted by jscheuer1

Use a valid URL DOCTYPE like:

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

That will fix it for IE 8.

Dear Mister John.
Thanks so much for your greate scripts and this fix.
I lost hours cheching were I messed up your code... Seems it was all correct.
Just added the information on the top like you said and everything started to work.

I have your script on a working ecommerce website.
Can you tell me please, what exactly does the change due?

Whats the difference between

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

and

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

Thanks

Thread: Image crawler problems in internet explorer

Thread Tools

Search Thread

Image crawler problems in internet explorer

The Following User Says Thank You to jscheuer1 For This Useful Post:

Fixed In Internex Explorer8

Bookmarks

Bookmarks

Posting Permissions