Jump to content

Recommended Posts

Posted

Hi gang,

 

Tweaking my latest design and decided to add in a page that has iFrame scrollers as an option to use for sections that have a lot of text.

 

Everything has been going alright, except now I have an issue with IE 6 and the iFrame scrollers. Just FYI, I am using 4 Level's iFrame Suite plugin in Dreamweaver to add the scrolling behavior and iFrames into the design. I am going to email them as well about the issue, but not sure it is within the scope of support there, so I figured I'd ask my TCH Family for some input, cuz you guys are always so helpful and I learn a lot here.

 

The Design in question:

 

PAGE 1 (non-template page)

www.natfunkmusic.com/mbstia/testplainscroll.htm

 

This is a page cretated in Photoshop > Sliced in Fireworks and exported to Dreamweaver.

 

Firefox 1.0.3 - scrollers work fine and text looks fine

 

IE6 - Scrollers just go up and down 1 pixel. They do not scroll properly.

 

 

PAGE 2 (DWT template page)

www.natfunkmusic.com/mbstia/test_scroll.htm

 

This is a design cretated in Photoshop > Sliced in Fireworks and exported to Dreamweaver and made into a DWT (Dreamweaver Template)

 

Problems:

 

Firefox 1.0.3 - scrollers work fine but for some reason the HEADING template editable region breaks up the design a bit. Because the design does not break up in the non-template file, I have a feeling that the design break up has something to do with inputting an editable region in the template file. I will have to play around with that to see if I can fix it.

Scrollers work fine

 

IE6 - Scrollers just go up and down 1 pixel. They do not scroll properly. The design part looks fine.

 

Any ideas where I can look to tweak to fix these issues?

 

Thanks

Posted (edited)

Ok, this is interesting. Just checked the design in Firefox again and the scrollers aren't working in either browser (IE 6 or Firefox)

 

I got the webdev tool for Firefox and there is are JS errors showing:

Error: uncaught exception: Permission denied to get property Window.frame
Error: uncaught exception: [Exception... "Component returned failure code: 0x80004005 (NS_ERROR_FAILURE) [nsIObserverService.removeObserver]"  nsresult: "0x80004005 (NS_ERROR_FAILURE)"  location: "JS frame :: chrome://browser/content/browser.js :: Shutdown :: line 831"  data: no]

 

What do those errors mean?

Edited by webgyrl
Posted (edited)

Got an email back from the iFrame Suite developer. He told me to take out the DocType in the pages that were being called into the iFrame and that has fixed the issue.

 

Now if I can figure out why adding in that editable template Header region is breaking up my design in Firefox, I'll be ready to rock and roll...

Edited by webgyrl
Posted
glad you got it working.

 

it looks good in firefox, very impresive.

but I see thin lines around the round scroll buttons in iE.

 

Thanks Don. I do have to figure out what sort of DocType will work as I have read it's really not good to leave the DocType completely out.

 

As for the lines, grrrr.. they have been a source of utter frustration. When I create the Editable Region for the Header in the Template file, it doest that. When I just leave it and don't make that a Dreamweaver Template, it renders fine without the line. I am fiddling with it to see if I can get it to work.

Posted (edited)

Interesting... iFrame misalignment

 

This has me confused:

 

There is a site I desgined a few months ago (without the 4 Level Dreamweaver plug-in):

http://www.deilsys.com

This uses iFrames and regular scroll bars. When I check it in the Mac Browser checker, it comes up fine with no misalignment of the iFrame.

Here is the code:

DEIL SYSTEMS SITE

><iframe id="frame" name="frame" width="610px" height="285px" align="left" frameborder="no" scrolling="yes" src="specials.htm">Your browser does not support iFrames. Please upgrade your browser so you have the latest version available.</iframe>

 

The plugin I used to create the iFrames this time rendered the following code:

MBSTIA SITE

><iframe id="frame" name="frame" style="position:absolute; width:675px; height:285px; top:338px; left:150px; z-index:1; background-color: #FFFFFF; layer-background-color: #FFFFFF; border: 1px none #000000;" frameborder="no" scrolling="no" src="../mbstia/test_scrollins.htm">Your browser does not support iFrames. Please upgrade your browser to the latest version.</iframe>

http://www.natfunkmusic.com/mbstia/test_scroll.htm

 

I tried to use the old (non-plugin) code in place of what I had for the iFrame code for the MBSTIA site to see if that would fix the misaligned iFrame:

><iframe id="frame" name="frame" width="675px" height="285px" align="left" frameborder="no" scrolling="no" src="../mbstia/test_scrollins.htm">Your browser does not support iFrames. Please upgrade your browser so you have the latest version available.</iframe>

 

But as you can see when you check it, it is still misaligned.

 

Why is that happening?

 

BTW I figured that the screen resolution has nothing to do with the misaligment as I checked it on 15,17 and 19 Inch Monitors in IE and Firefox and the iFrame is aligned fine. It just does not align on a Mac.

 

Strange.

Edited by webgyrl
Posted
I did find a nice site to show all the options for iframes

maybe set margins to zero

http://www.htmlcodetutorial.com/frames/_IFRAME.html

 

Hey Don :thumbup1:

 

thanks for the link to that site.

 

I did set the margins to 0. It's weird because I used an older bit of code I had for iFrames and that is working fine now. I am not sure why the iFrame Suite code messes up the alignment.

 

Still looking in to it.

 

Someone told me the other day that my using scrollers would put a lot of web users "off". Do you think this is true?

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Unfortunately, your content contains terms that we do not allow. Please edit your content to remove the highlighted words below.
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...