www.webdeveloper.com
Results 1 to 14 of 14

Thread: CSS Image positioning issue - VERY STRANGE!

Hybrid View

  1. #1
    Join Date
    Apr 2009
    Posts
    17

    CSS Image positioning issue - VERY STRANGE!

    Hi Guys

    So please can you take a look at the following page (still under construction!!)

    http://www.kentculturalbaton.com/art...hitstable.html

    You may notice that the first load of each image (pulled direct from Flickr) shifts the main image out of position. Once you click another thumbnail then go back to the original the image sits where it is should be!! WIERD!!

    Inspected first time - WRONG!
    <img width="500" height="276" src="http://static.flickr.com/4071/4645135791_a269decf71.jpg" style="display: block; position: absolute; z-index: 0; height: auto; visibility: visible; width: auto; left: 230px; top: 173px; opacity: 1;" alt="beach_flags_with_traffic_wardens">

    2nd time - Left & top are correct:
    <img width="500" height="276" src="http://static.flickr.com/4071/4645135791_a269decf71.jpg" style="display: block; position: absolute; z-index: 2; height: auto; visibility: visible; width: auto; left: 30px; top: 62px; opacity: 1;" alt="beach_flags_with_traffic_wardens">

    Anyone got any ideas??

    Also this page just will not work in IE6 (I know, it's the client!)

    Many thanks in advance :-)

    McCann

  2. #2
    Join Date
    Jan 2005
    Location
    Frankfort, KY, USA
    Posts
    6,167
    I'm guessing it's a clearing problem related to your nav bar. Try clearing the image - I can't give you specifics because your page just became inaccessible.
    FYI
    * My screen resolution is set at 1680x1050
    * I'm accessing your site through a T1 line
    * I'm probably viewing it using Firefox (unless browser is specified)

  3. #3
    Join Date
    Apr 2009
    Posts
    17
    Thx so much for looking, so we have been breaking this page and fixing it back up all day and night. So we are now working on another test copy, so this page that I originally linked is back up for you to poke at again :-) if you all don't mind that is?

    Very greatful for any ideas help or suggestions.

  4. #4
    Join Date
    Jan 2005
    Location
    Frankfort, KY, USA
    Posts
    6,167
    The gallery is not appearing, and the <div> upon viewing the source has no contents. ???
    FYI
    * My screen resolution is set at 1680x1050
    * I'm accessing your site through a T1 line
    * I'm probably viewing it using Firefox (unless browser is specified)

  5. #5
    Join Date
    Apr 2009
    Posts
    17
    OK, so we are building this up with JavaScript. I have just checked again and the gallery now loads in Firefox, we have issues with IE6 but 7 & 8 should now work. Cache perhaps?
    Thanks again for looking :-)

  6. #6
    Join Date
    Jan 2005
    Location
    Frankfort, KY, USA
    Posts
    6,167
    Try adding:
    Code:
    .slideshow {
    	display: block;
    	position: relative;
    	z-index: 0;
    clear: both;
    }
    FYI
    * My screen resolution is set at 1680x1050
    * I'm accessing your site through a T1 line
    * I'm probably viewing it using Firefox (unless browser is specified)

  7. #7
    Join Date
    Apr 2009
    Posts
    17
    OK tried that, with no luck :-(

  8. #8
    Join Date
    Apr 2009
    Posts
    17
    SOME SUCCESS!!!!! So we have managed to get the images pulling from our Flickr resource....NOW the image positioning that we get from the JS calculation is off, depending on the current image size and the image that you are viewing next....

    Any ideas???

  9. #9
    Join Date
    Jun 2010
    Posts
    92
    It looks really nice though! Doesn't seem off to me?

  10. #10
    Join Date
    Apr 2009
    Posts
    17
    Thanks for that adamou :-) If you toggle between images you may notice that the image jumps around, I now know that this is because of the start location of the first image (as in the co-ordinates), I just do not know how to resolve it...

  11. #11
    Join Date
    Jun 2010
    Posts
    92
    hum well the only issue with image location is when you click on play but if you browse on the bottom and click on the iamges there, everything comes up fine.

    I tried following the code but its a bit hard to concetrate atm I'll try go through it later on

  12. #12
    Join Date
    Apr 2009
    Posts
    17
    Thanks again for looking :-) Try toggling between the last three images (gold bar, tree and girl) you will see the problem better there. Let me know what you think :-)

  13. #13
    Join Date
    Jun 2010
    Posts
    92
    did you guys fix it? I can't get it to bug up anymore, what was the issue?

  14. #14
    Join Date
    Apr 2009
    Posts
    17
    Hi Adamou :-)

    Thanks for checking again on this.
    We have managed to get it working really well now...BUT...this doesn't work in IE6!!!! :-(
    We have tried everything but just can't get IE6 to work with or load up the Ajax.

    Any ideas are always welcome :-)

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

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



Recent Articles