Results 1 to 3 of 3

Thread: break circle of dependence of absolute positioned elements

  1. #1
    Join Date
    Oct 2007
    Location
    Germany, Berlin
    Posts
    41
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default break circle of dependence of absolute positioned elements

    "Hello World"
    I've made a gallery in css. If the server is online check my projects under http://www.lafeijoa.de/home The main menu is positioned absolute in a circle in the center. Beeing on the photo page on the left are the thumbnails, also positioned absolutely. Clicking a thumb the real image should be shown in front of all and positioned absolutely in the center of the WINDOW! But if the width of the thumb gallery is only 200px and not about the width of the full window how do I get it into the center of the window? (I use this "position-50-50%-margin:-half of imagesize"-method)
    So the question is how to get out of the vicious circle of the dependence of one absolute positioned element to his parent element?

    Code:
    <div style="position:absolute;width:200px;">
    <a href="#" style="background:url(thumb.jpg);"><img /><em style="background:url(image.jpg);"></em></a> 
    <!-- OnClick em will be shown and image will be loaded -->
    ...
    </div>
    Please help! I need a solution working on every browser!

    greetings from Berlin
    Max

    PS: idea by Stu Nichols ( http://www.cssplay.co.uk )

  2. #2
    Join Date
    Jul 2006
    Location
    just north of Boston, MA
    Posts
    1,806
    Thanks
    13
    Thanked 72 Times in 72 Posts

    Default

    you could look into the "lightbox" it creates a new layer on the page and opens the image / slideshow.
    http://www.dynamicdrive.com/dynamici...box2/index.htm
    Last edited by jscheuer1; 10-25-2007 at 02:35 PM. Reason: fix link

  3. #3
    Join Date
    Oct 2007
    Location
    Germany, Berlin
    Posts
    41
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Thank you boogieman, but I am looking for a method in css without the use of JavaScript!

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
  •