Page 1 of 2 12 LastLast
Results 1 to 10 of 18

Thread: Interent explorer display issue

  1. #1
    Join Date
    Nov 2011
    Posts
    205
    Thanks
    2
    Thanked 1 Time in 1 Post

    Default Interent explorer display issue

    I have made a site with the help of my friend & checking out things as i go along.

    I have noticed that my search option on the site works as it should in Firefox / Chrome & Safari, but Internet explorer is a different situation.

    Below is the site in question.
    http://www.theremotedoctor.co.uk/

    If you do the following steps in IE you will see the problem.
    Hover over keys & remotes
    Then select Audi.

    The problem is now see.
    You should just click on Flip Remote 3 Button and a photo of this is then shown to the right.
    If you cancel out the error message then select the option you then see a part of the home screen instead ?
    This is the same result for the other search options.

    As mentioned above FRirefox/Chrome & safari all work correct.
    Is there some code i could add to each page so IE shows the correct item with no error message.
    Last edited by theremotedr; 10-07-2013 at 08:32 PM.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,165
    Thanks
    44
    Thanked 3,239 Times in 3,200 Posts
    Blog Entries
    12

    Default

    It works in IE 9+. In IE 8 it does what you're saying. This has little to do with css. I say little because in IE 9 and 10 there are scrollbars on the content once it loads. Setting:

    Code:
    object {
    overflow: hidden;
    }
    in the stylesheet may help that, or inline with the code that generates the new object tag. Or simply increasing the width and/or height of the generated tag, or getting rid of overflow on the page that it loads into, etc.

    The problem in IE 8 is with the use of the object tag, specifically its data attribute. You have it set initially to "" (nothing). Try using "about:blank" - that might fix it. I'm thinking the browsers where it works see the empty data attribute as empty, whereas IE 8 sees it pointing to the page itself.

    But that might not be the problem at all. It's worth a try though.

    The browser cache may need to be cleared and/or the page refreshed to see changes.


    Later it occurred to me that instead of setting the data to "about:blank", simply having no data attribute might work.
    Last edited by jscheuer1; 10-02-2013 at 06:53 PM. Reason: Later . . .
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Nov 2011
    Posts
    205
    Thanks
    2
    Thanked 1 Time in 1 Post

    Default

    Thanks for the input.
    I have added "about:blank" as suggested and there is now no error message.
    What i see now is a blank box as you would expect.
    I then continue to click on the selection and the item for sales photo is then shown.

    I just need to see now how i can change from this blank box to a blue square,this would be after selecting the car manufacturers name and before making the selection of items for sale.

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,165
    Thanks
    44
    Thanked 3,239 Times in 3,200 Posts
    Blog Entries
    12

    Default

    Make a blank page with a blue background. Use it's address as the initial address for data instead of "about:blank". Or, instead of having an initial object tag there at all, just have a square empty div of the desired dimensions and background color.

    I did a little experimenting and setting overflow hidden on the object doesn't seem to get rid of its scrollbars. Setting overflow hidden on the html and body tags on the page(s) you show through the object should take care of it.

    This is very similar to using an iframe. Any reason why you're not?
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. #5
    Join Date
    Nov 2011
    Posts
    205
    Thanks
    2
    Thanked 1 Time in 1 Post

    Default

    Hi
    What would be the correct code to use if my new file is called blank_page
    Line of text in use at the moment <object data="about:blank" type="text/html" name="foo" width="300" height="525" align="center" id="foo">

  6. #6
    Join Date
    Nov 2011
    Posts
    205
    Thanks
    2
    Thanked 1 Time in 1 Post

    Default

    This is a learning curve for me.
    I have used <a href="blank_page" type="text/html" name="foo" width="300" height="525" align="center" id="foo" /></a> and seems top be ok.
    I am now looking at removing the scrollbars

  7. #7
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,165
    Thanks
    44
    Thanked 3,239 Times in 3,200 Posts
    Blog Entries
    12

    Default

    Well, you shouldn't have a blank page named blank_page. The browser might not know what to do with it. You should do like blank_page.htm. But it would really be easier and make more sense to just have a blank blue div there instead of:

    Code:
    <!-- Show the price information when link clicked -->
    <div class="price" id="content_price">
    <object data="" type="text/html" name="foo" width="300" height="520" align="center" id="foo">
     
    </object>
    <!-- end of price and information screen -->
    
    </div><!-- end content_price -->
    Do this:

    Code:
    <!-- Show the price information when link clicked -->
    <div class="price" id="content_price">
    <div style="width: 300px; height: 520px; background-color: blue; margin: 0 auto;">
     
    </div>
    <!-- end of price and information screen -->
    
    </div><!-- end content_price -->
    The highlighted part gets overwritten anyway. It gets replace, not modified, so you can have anything you want there. When the button is clicked, a new object tag will replace it.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  8. #8
    Join Date
    Nov 2011
    Posts
    205
    Thanks
    2
    Thanked 1 Time in 1 Post

    Default

    Hi,
    I have now changed all my pages to the div suggestion above.
    I have resized the container in the css file called content price & key image with various tests and what you now see when using Internet Explorer is just the scroll bar at the bottom of the listing.
    These sizes now applied result in just the bottom scroll bar without the side scroll bar.
    With this in place Chrome & Firefox show a small amount of cloud background.

    I am unable to totally remove both the scroll bars,or with two scroll bars Chrome & Firefox then show a full photo without the cloud background at the bottom.

    Any advise regarding this issue or is it a catch 22 situation ?

    Many thanks for the help so far.

  9. #9
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,165
    Thanks
    44
    Thanked 3,239 Times in 3,200 Posts
    Blog Entries
    12

    Default

    IE 8 still has a scrollbar at the bottom. IE 9 + do not, and show a little of the cloud background there.

    There are conditional comments that can be used to set browser specific styles for IE 9 and less. If the dimensions for the object tag are set in a stylesheet, which they can be, those conditionals could be used to tweak it for IE 8 and less in a separate stylesheet.

    But, before we try that, try setting the width and height to what they were when you liked how it looked in the other browsers.

    Then on the page that shows through the object tag (audi/audi001.html), put this in the head of the page:

    Code:
    <style type="text/css">
    html, body {overflow: hidden;}
    </style>
    That could take care of the scrollbars in any browser, and if it works for IE, will solve the problem.

    I would ask though, why is there even a cloud background on that page (audi/audi001.html)? It could have a solid blue background, then if part of the background were to show through, it wouldn't look so bad.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  10. #10
    Join Date
    Nov 2011
    Posts
    205
    Thanks
    2
    Thanked 1 Time in 1 Post

    Default

    Hi,
    I have put the sizes back so Chrome & Firefox are shown how i like.
    I then added the code to the head as advised.
    Looks good to me.

    Please would you mind checking at your end.

    The cloud background gives the page a bright fresh look.
    Within the container of where we are cocentrating at the moment i do not know why the background is shown there ?

Similar Threads

  1. ddtreemenu Internet Explorer 8 (IE8) Issue
    By Logberg in forum Dynamic Drive scripts help
    Replies: 4
    Last Post: 04-25-2013, 04:39 PM
  2. Fade Slideshow Internet Explorer issue
    By RichardN in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 10-29-2010, 08:50 AM
  3. Drop Down Menu Issue - Internet Explorer
    By theflyingminstrel in forum CSS
    Replies: 0
    Last Post: 08-13-2008, 04:31 PM
  4. Tab Content Script issue in Internet Explorer
    By Rohit Malik in forum Dynamic Drive scripts help
    Replies: 3
    Last Post: 08-17-2007, 03:11 AM
  5. Replies: 1
    Last Post: 08-01-2007, 05:05 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •