Home/ Questions/Q 8864727
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-14T16:19:09+00:00

I have a page where necessary elements are repositioned over some extra html attributes.

  • 0

I have a page where necessary elements are repositioned over some extra html attributes.

For example:

<div class="contentplate" relativePosition="top-left" relx="1" rely="3" relw="14" relh="8"  relFontSize="80"></div>

is repositioned by class ‘contentplate’. It is positioned to a raster related on the actual windowsize. It’s child elements are processed recursively to get the relative positioning also working inside this containers. All of this works as expected.

The trouble begins when using jQuery(‘parentcontainer’).animate( {left:0},100 ) or something:
in some way repositioning the elements leads, jquery to animate only the parent element and not the childs.
the funny part is after te animation is done, the position of the childs is corrected somehow by jQuery but as told not animated.

All the elements are styled position:absolute, overflow:hidden

and no, the repsotion algorithm only runs if the window is resized, or after the page has been loaded once.

I have 3 Test for you if you are interested:
the site fully dynamically repositioning (animation is failing, except in firefox)
http://www.bourier.org/demos/jquery_animation_failure/test_2.html

a snapshot of a repositioned site without active repositioning (all browsers, all good)
http://www.bourier.org/demos/jquery_animation_failure/test.html

a fully dynamically repostioning site with a yellow grid you can see enabled
http://www.bourier.org/demos/jquery_animation_failure/test_3.html

a screenshot where you can see the dynamic page with grid enabled
enter image description here
thanks for your time

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    As it seems, it is a bug in the browser Engine correlated to usage of a canvas and CSS modifications of div’s z-ordered above.

    The canvas is there only for checking the grid features are correct e.g. debugging purposes.

    I removed the canvas and everything is working now as expected.

    There is something very wrong, can be shown here using the chrome developer tools:
    The elements are detected in the correct position by the debugger, and mousepointer, but they are not displayed there. very odd this.

    enter image description here

    i don’t want to digg deeper than this, but in my opinion the Firefox behaviour is correct and Chrome and Safari are doing something very wrong.

    If i should post a issue report to chrome developers leave a comment and i will.

    • 0