Добрый день!
Вопрос по загрузки элементов в dom в частности для object
Css
#line1_size{
float:left;
width:300px;
height:300px;
position:relative;
left:-10px;
border:1px solid greenyellow;
margin:0px;
[B] display:none;[/B]
}
html
<div id="line1_size">
<object id='svg_right_line' data="/svgpic/line_portfolio.svg" type="image/svg+xml">
</object>
</div>
JS
function anim(){
/*'вызывается функция анимации..*/
anim_obj_new(300,3000,'svg_right_line','line1',300,proper)
}
/* здесь просиходит смена cтилей css*/
var obj=parent.document.getElementById('line1_size');
obj.style.display='block';
}
Если вызвать эту функцию при 1 клике то содержимое тега object сначало станет видимым(dispaly:block) Но никакой анимации не будет.
И только при 2 клике анимация начнет действовать)
Я начал проверять порядок загрузки в DOM содержимого тега object и пришел к выводу что такое поведение связано с тем,что у тега object стоит стиль display:none;
И действительно как только я поменял
display :none на
opacity:0 а в функции указал
div_bottom_line.style.opacity='1'
содержимое тега object сразу подгрузилось в dom и пр 1клике анимация заработала.
Вопрос ..это такая особенность тега object что если display none то его содержимое браузер не видит..или все таки что то я не так делаю..
Может вопрос и не конкретно по JS но все же есть проблема с загрузкой в DOM