Dynamic DIV
-
Hi all, I have this script where i generate DIVs dynamically and put them one under another by setting their style.top property. Now when i add any thing to the top most positioned DIV and increase its height, it expands and overlaps the DIV below. Is there anyway, in which i can make these DIVs like normally generated DIVs, so that they push down other DIVs when their height is increased. Or is there a workaround for this problem. Thanks in advance. *** Who said nothing is impossible? I have been doing it for a long time ***
-
Hi all, I have this script where i generate DIVs dynamically and put them one under another by setting their style.top property. Now when i add any thing to the top most positioned DIV and increase its height, it expands and overlaps the DIV below. Is there anyway, in which i can make these DIVs like normally generated DIVs, so that they push down other DIVs when their height is increased. Or is there a workaround for this problem. Thanks in advance. *** Who said nothing is impossible? I have been doing it for a long time ***
-
Can you please explain a bit more as to what z-index property exactly does and how its presence impacts surrounding elements ?? Thanks in advance. *** Who said nothing is impossible? I have been doing it for a long time ***
Look this help with sample: http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/properties/zindex.asp Best regards, Alexey.
-
Can you please explain a bit more as to what z-index property exactly does and how its presence impacts surrounding elements ?? Thanks in advance. *** Who said nothing is impossible? I have been doing it for a long time ***
-
Hi all, I have this script where i generate DIVs dynamically and put them one under another by setting their style.top property. Now when i add any thing to the top most positioned DIV and increase its height, it expands and overlaps the DIV below. Is there anyway, in which i can make these DIVs like normally generated DIVs, so that they push down other DIVs when their height is increased. Or is there a workaround for this problem. Thanks in advance. *** Who said nothing is impossible? I have been doing it for a long time ***
-
If you position them absolutely there is no way that they can adjust to the size of other elements. Just put them in the normal flow of the page. --- b { font-weight: normal; }
Hi Guffa, Thanks for coming to my rescue again. It would really be nice if i could put the DIVs in the normal flow of the page. But since i am required to generate them dynamically, it is not possible to do so. Ok, to tell you the actual thing, i am actually writing a script to display a Dynamic Tree View. I know there are quite a number of such free sources, but i wish to do it on my own so that i can have the display my way. According to my code, when a user clicks on a + sign, 1) The sub-directories are retrieved from the database using AJAX. 2) DIVs are created dynamically and initialized properly 3) The DIVs are embedded inside the parent DIV using appendChild and the height of the parent is increased to accomodate the newly created DIVs. I have to use
overflow:hiddenproperty for all the DIVs because without that the generated DIVs fail to display themselves inside the parent DIV and they get displayed outside the parent DIV on the main page. Now, since the parent DIV has been created in the normal flow, when they expand, they push down the other DIVs under them. But the ones generated by me, fail to do so and overwrite on the ones below. I hope i was able to explain you my logic. Is my logic ok, or is there a better way of doing this thing. I have not tried, but i feel that i should alter the innerHTML of the parent DIV to add the newly created DIVs. Please help me out. Thanks in advance. *** Who said nothing is impossible? I have been doing it for a long time ***
-
Hi Guffa, Thanks for coming to my rescue again. It would really be nice if i could put the DIVs in the normal flow of the page. But since i am required to generate them dynamically, it is not possible to do so. Ok, to tell you the actual thing, i am actually writing a script to display a Dynamic Tree View. I know there are quite a number of such free sources, but i wish to do it on my own so that i can have the display my way. According to my code, when a user clicks on a + sign, 1) The sub-directories are retrieved from the database using AJAX. 2) DIVs are created dynamically and initialized properly 3) The DIVs are embedded inside the parent DIV using appendChild and the height of the parent is increased to accomodate the newly created DIVs. I have to use
overflow:hiddenproperty for all the DIVs because without that the generated DIVs fail to display themselves inside the parent DIV and they get displayed outside the parent DIV on the main page. Now, since the parent DIV has been created in the normal flow, when they expand, they push down the other DIVs under them. But the ones generated by me, fail to do so and overwrite on the ones below. I hope i was able to explain you my logic. Is my logic ok, or is there a better way of doing this thing. I have not tried, but i feel that i should alter the innerHTML of the parent DIV to add the newly created DIVs. Please help me out. Thanks in advance. *** Who said nothing is impossible? I have been doing it for a long time ***
CoolASL wrote:
It would really be nice if i could put the DIVs in the normal flow of the page. But since i am required to generate them dynamically, it is not possible to do so.
Yes, it is. You can dynamically add elements into the page, and it will reflow to accomodate the new elements.
I have to use overflow:hidden property for all the DIVs because without that the generated DIVs fail to display themselves inside the parent DIV and they get displayed outside the parent DIV on the main page.
That sounds like a strange workaround. Is that because you are positioning the elements absolutely instead of actually placing them inside the parent element? --- b { font-weight: normal; }
-
Hi Guffa, Thanks for coming to my rescue again. It would really be nice if i could put the DIVs in the normal flow of the page. But since i am required to generate them dynamically, it is not possible to do so. Ok, to tell you the actual thing, i am actually writing a script to display a Dynamic Tree View. I know there are quite a number of such free sources, but i wish to do it on my own so that i can have the display my way. According to my code, when a user clicks on a + sign, 1) The sub-directories are retrieved from the database using AJAX. 2) DIVs are created dynamically and initialized properly 3) The DIVs are embedded inside the parent DIV using appendChild and the height of the parent is increased to accomodate the newly created DIVs. I have to use
overflow:hiddenproperty for all the DIVs because without that the generated DIVs fail to display themselves inside the parent DIV and they get displayed outside the parent DIV on the main page. Now, since the parent DIV has been created in the normal flow, when they expand, they push down the other DIVs under them. But the ones generated by me, fail to do so and overwrite on the ones below. I hope i was able to explain you my logic. Is my logic ok, or is there a better way of doing this thing. I have not tried, but i feel that i should alter the innerHTML of the parent DIV to add the newly created DIVs. Please help me out. Thanks in advance. *** Who said nothing is impossible? I have been doing it for a long time ***
CoolASL wrote:
I have to use overflow:hidden property for all the DIVs because without that the generated DIVs fail to display themselves inside the parent DIV and they get displayed outside the parent DIV on the main page.
You're making this waaay too complex. I'm gonna make one major assumption, that you are not making the parent DIV absolutely positioned or fixing the height - if you are doing either of these, then stop it. With that out of the way, you should be able to add children and the parent DIV will automatically resize to contain them. No manual sizing or positioning required. :)
Now taking suggestions for the next release of CPhog...
Last modified: Tuesday, April 18, 2006 10:02:10 PM -- spelling...
-
CoolASL wrote:
I have to use overflow:hidden property for all the DIVs because without that the generated DIVs fail to display themselves inside the parent DIV and they get displayed outside the parent DIV on the main page.
You're making this waaay too complex. I'm gonna make one major assumption, that you are not making the parent DIV absolutely positioned or fixing the height - if you are doing either of these, then stop it. With that out of the way, you should be able to add children and the parent DIV will automatically resize to contain them. No manual sizing or positioning required. :)
Now taking suggestions for the next release of CPhog...
Last modified: Tuesday, April 18, 2006 10:02:10 PM -- spelling...
Hey thanks Shog. That really helped me out. After reading yours and Guffa's reply I set out again from scratch and found that i made a wrong assumption at one place. Which means that the initial research was defective... :laugh: Thanks for the help. I think i'll be able to continue from here. Thanks a lot. *** Who said nothing is impossible? I have been doing it for a long time ***
-
CoolASL wrote:
It would really be nice if i could put the DIVs in the normal flow of the page. But since i am required to generate them dynamically, it is not possible to do so.
Yes, it is. You can dynamically add elements into the page, and it will reflow to accomodate the new elements.
I have to use overflow:hidden property for all the DIVs because without that the generated DIVs fail to display themselves inside the parent DIV and they get displayed outside the parent DIV on the main page.
That sounds like a strange workaround. Is that because you are positioning the elements absolutely instead of actually placing them inside the parent element? --- b { font-weight: normal; }
Hey thanks Guffa. That really helped me out. After reading yours and Shog's reply I set out again from scratch and found that i made a wrong assumption at one place. Which means that the initial research was defective... :laugh: Thanks for the help. I think i'll be able to continue from here. Thanks a lot. *** Who said nothing is impossible? I have been doing it for a long time ***