PDA

View Full Version : IFRAME Scroller script IE8 compatibility



amots
12-06-2010, 06:36 AM
1) Script Title: IFRAME Scroller script

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex2/iframe-scroller.htm

3) Describe problem:Not working in IE8. Works wellin FF, Safari, Chorme and IE8 compatibility view.
If is set to emulate IE8 to IE7 (compatibility View), it will work, but all my css will be hurt.

Please guide.

jscheuer1
12-06-2010, 07:04 AM
The demo page:

http://www.dynamicdrive.com/dynamicindex2/iframe-scroller.htm

works fine here in IE 8 in IE 8 standards mode.

So it's probably either something to do with your implementation, or something to do with your browser.

It could be something else.

If you want more help:

Please post a link to a page on your site that contains the problematic code so we can check it out.

amots
12-06-2010, 07:51 AM
Thansk for the response.
Please check this URL

http://www.faisalalmutawa.com/start.aspx

On the right hand down corner there is a iframe for Phot Gallery

jscheuer1
12-06-2010, 06:34 PM
I'd suggest rethinking everything. The page - too many tables. The scroller - depends upon iframe and has a big gap in it. The hover thing - needs a way to deal with overlap in IE, perhaps others.

But there is a way, add a height and an id to the td and alter the script as shown:


<td id="wherewewantit" style="width: 290px; height: 288px; padding-right: 0px; padding-left: 0px; padding-bottom: 0px; padding-top: 0px; margin: 0px; ">


<script type="text/javascript">

/***********************************************
* IFRAME Scroller script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
/*@cc_on @*/
/*@if(@_jscript_version >= 5)
if((navigator.userAgent).replace(/^.*MSIE (\d).*$/, '$1') < 8){
@end @*/

//specify path to your external page:
var iframesrc="external2.htm"

//You may change most attributes of iframe tag below, such as width and height:
document.write('<iframe id="datamain" src="'+iframesrc+'" style="width: 290px; height: 288px; background-color: #E1E4E9;" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="no"></iframe>')
/*@if(@_jscript_version >= 5)
}
@end @*/
</script>

</td>

Then, as the very last thing before the closing </body> tag, add this highlighted code as shown:


<script type="text/javascript">
_uacct = "UA-9678881-1";
urchinTracker();
</script>
<!--[if gt IE 7]>
<script type="text/javascript">
document.write('<iframe id="datamain" src="external2.htm" style="width: 290px; height: 288px; background-color: #E1E4E9;" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="no" onload="var t = document.getElementById(\'wherewewantit\'); t.innerHTML = \'\'; t.appendChild(this);this.onload=function(){return;};"></iframe>');
</script>
<![endif]-->
</body>
</html>

amots
12-08-2010, 06:15 AM
Thanks,

It worked.