Results 1 to 5 of 5

Thread: Dynamic Ajax not moving content below it.

  1. #1
    Join Date
    Apr 2008
    Posts
    21
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Dynamic Ajax not moving content below it.

    1) Script Title: Dynamic ajax content, Cmotion gallery script

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...jaxcontent.htm

    3) Describe problem: I'm using 2 wonderful scripts - dynamic ajax content and cmotion gallery 2. i've got it to load what i need but i don't understand how to make the ajax content slide images on the page down when it loads like you see on http://www.dynamicdrive.com/dynamici...jaxcontent.htm

    here's a link to the page i have it loaded to http://www.bzcaraudio.com/tires.html
    note that the only image in cmotion i have ajax on is the first tire pic. i imagine this is probably something easy but please be specific in your help if you can for i am still learning all this but learn very fast. thanks again in advance.

  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 is really a matter of the positioning of the e17 division, which is currently absolute, so will not move in relation to other content on the page. However, it appears to me that virtually all of your page is built upon absolute positioning. Absolutely positioned elements do not take up any layout space, so will not for the most part react to other elements being introduced to the page that do.

    The best approach here would probably be to redesign the entire page so as to not rely so heavily upon absolute positioning. But that is beyond the scope of this forum, though we could help you with that if you decided to give it a shot and ran into a problem or two. If you want to go down that road, post any questions you might have about it in the HTML or the css sections of the main forum.

    For the time being, it looks to me that you could just move e17 out of the way, move it lower on the page:

    Code:
    <div id="e17" style="position:absolute;left:273px; top:1000px; width:500px;height:64px;">
    something like that, leaving room for your imported content.
    - John
    ________________________

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

  3. #3
    Join Date
    Apr 2008
    Posts
    21
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    cool, i understand what your saying and i've been planning on redoing the whole site anyway. what should i use for the positioning (relative)? Just so i can try it on this page and understand how it works, is changing that only image what needs to be done?

  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

    Relative positioning can mess up in IE 7 when its new zoom utility is used. So I try to avoid it. Also, if you have a few absolutely positioned items with relatively positioned ones inside those, the net effect is almost the same as absolute positioning. The best positioning is static, which is the default positioning and therefore doesn't need to be specified. However, once you use static positioning, you can no longer specify top or left. You can use margins and padding though to tweak positions.

    Getting back to your current design, yes. To allow room for the imported content, only the e17 container needs to be moved down.
    - John
    ________________________

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

  5. #5
    Join Date
    Apr 2008
    Posts
    21
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    thanks, i'll give it a try.

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
  •