Results 1 to 5 of 5

Thread: Problems with Image Thumbnail Viewer Script in IE

  1. #1
    Join Date
    Sep 2009
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Problems with Image Thumbnail Viewer Script in IE

    Image Thumbnail Viewer Script

    http://www.dynamicdrive.com/dynamicindex4/thumbnail.htm


    I am having prolbems with how the images on my website are presented IE They show up fine in Firefox, Chrome and Safari but they extend beyond the content page in IE, overlap with other text causing the page to shift.

    Code:
    <br>
    <div id="thumbnail-small"><a  href="http://www.pictures-of-jamaica.com/image-files/the-lyndhust.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/the-lyndurst-thumb.jpg" alt="old colonial houses, new old houses"></a></div>
    <div id="thumbnail-small"><a  href="http://www.pictures-of-jamaica.com/image-files/hopefield.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/hopefield-thumb.jpg" alt="Jamaican scene, photos of old stone houses"></a></div>
    <div id="thumbnail-small"><a  href="http://www.pictures-of-jamaica.com/image-files/colonialhouse.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/colonialhouse-thumb.jpg" alt="tropical pictures, st. ann jamaica, old plantation house"></a></div>
    </div>
    
    <p></p>
    <div id="thumbnail-small"><a  href="http://www.pictures-of-jamaica.com/image-files/porus-house.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/porus-house-thumbnail2.jpg" alt="tropical sunrise, jamaica morning, caribbean sea pics"></a></div>
    <div id="thumbnail-small"><a  href="http://www.pictures-of-jamaica.com/image-files/rennies.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/rennies-thumb.jpg" alt="pictures of old houses, renovating old houses"></a></div>
    <div id="thumbnail-small"><a  href="http://www.pictures-of-jamaica.com/image-files/leftovers.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/leftovers-thumb.jpg" alt="old smoke houses, tropical cottage, this old house"></a></div>
    br>
    <br>
    <br>
    <div id="thumbnail-small"><a  href="http://www.pictures-of-jamaica.com/image-files/comforthall.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/comforthall-thumb.jpg" alt="old colonial houses, old stone houses, old farm houses"></a></div>
    <div id="thumbnail-small"><a  href="http://www.pictures-of-jamaica.com/image-files/bluehouse.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/bluehouse-thumb.jpg" alt="old colonial houses, old cottages,tropical cottages"></a></div>
    <div id="thumbnail-small"><a  href="http://www.pictures-of-jamaica.com/image-files/peak-roofs.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/peak-roofs-thumbnail2.jpg" alt="tropical pictures, picturesque old cottage, renovate old houses"></a></div>
    <div id="thumbnail-small"><a  href="http://www.pictures-of-jamaica.com/image-files/sav1.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/sav1-thumb.jpg" alt="old houses by the ocean, old country houses, wrap around veranda"></a></div>
    <div id="thumbnail-small"><a  href="http://www.pictures-of-jamaica.com/image-files/sav2.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/sav2-thumb.jpg" alt="pictures of old houses, renovating old houses"></a></div>
    <div id="thumbnail-small"><a  href="http://www.pictures-of-jamaica.com/image-files/summerhouse.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/summerhouse-thumb.jpg" alt="pictures of old houses, renovating old houses"></a></div>
    <br>
    
    <br>
    <br>
    <br>
    <br>
    <br>
    <p></p>
    <p></p>
    <p></p>
    <br>
    <br>
    
    
    <br>
    </p>
    <div id="thumbnail-small"><a  href="http://www.pictures-of-jamaica.com/image-files/redstep.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/redstep-thumb.jpg" alt="old colonial houses, old red brick houses, pictures of old houses"></a></div>
    <div id="thumbnail-small"><a  href="http://www.pictures-of-jamaica.com/image-files/bland.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/bland-thumb.jpg" alt="old colonial houses, bland house, ugly old houses"></a></div>
    <div id="thumbnail-small"><a  href="http://www.pictures-of-jamaica.com/image-files/redcottage.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/redcottage-thumb.jpg" alt=", picturesque old cottage, photography old houses"></a></div>
    <div id="thumbnail-small"><a  href="http://www.pictures-of-jamaica.com/image-files/norwood1.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/norwood1-thumb.jpg" alt="old colonial houses, old red brick houses, st andrew, jamaica"></a></div>
    <div id="thumbnail-small"><a  href="http://www.pictures-of-jamaica.com/image-files/pinkhouse.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/pinkhouse-thumb.jpg" alt="old colonial houses, old pink house, tropical cottages"></a></div>
    <div id="thumbnail-small"><a  href="http://www.pictures-of-jamaica.com/image-files/trainstation.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/trainstation-thumb.jpg" alt="tropical pictures, picturesque old cottage, renovate old houses"></a></div>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    
    <br>
    <br>
    
    
    <p> Copyright © 2009 pictures-of-jamaica.com All rights reserved.
    </p>
    </div>
    
    <!-- end Liner --> </div>
    <script src="http://www.pictures-of-jamaica.com/support-files/thumbnailviewer.js" type="text/javascript">
    /***********************************************
    * Image Thumbnail Viewer Script- © Dynamic Drive (www.dynamicdrive.com)
    * This notice must stay intact for legal use.
    * Visit http://www.dynamicdrive.com/ for full source code
    ***********************************************/
    </script>
    <!-- end Footer --><!-- end PageWrapper --><!-- google analytics -->
    
    <script type="text/javascript">
    var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
    document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
    </script>
    <script type="text/javascript">
    try {
    var pageTracker = _gat._getTracker("UA-10840733-1");
    pageTracker._trackPageview();
    } catch(err) {}</script>
    </div></body></html>
    Can anyone please help?

    Thanks.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    This would be much easier to diagnose if we had a link to a live page which demonstrates the problem.

    How about it?
    - John
    ________________________

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

  3. #3
    Join Date
    Sep 2009
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi John,

    My site is http://www.pictures-of-jamaica.com/t...l-scenery.html

    The thumbnails display horribly here and in other pages on the site in IE but fine elsewhere.

    Thanks for taking a look.

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Near as I can tell, this is just a layout problem. If you set the container division's width to like 585px or so:

    Code:
    <h1>Tropical Scenery</h1>
    <!-- below-h1 --><br>
    <div style="text-align: justify; width: 585px;">Have you ever visited a
    tropical island and been left wondering somewhat whether there isn't
    more to the island than sand and sea? Well if you have, you should come
    to Jamaica because when it comes to diversity o
    It should improve things, does here in IE 7 using its developer toolbar. However, your page could use a complete makeover (it has script, css and validation errors, and cannot take advantage of the space that might be available to it in some browsers. Unfortunately that is not something we generally undertake in these forums.
    - John
    ________________________

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

  5. #5
    Join Date
    Sep 2009
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks John I worked on it and it now works in IE.

    Learned a lot too.

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
  •