用.innerHTML写的内容后动画div大小 [英] animating div size after content written with .innerHTML

查看:93
本文介绍了用.innerHTML写的内容后动画div大小的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个链接,将我的页面的一部分加载到div中,div高度设置为0px,溢出设置为隐藏。


我没有遇到任何问题从外部文件加载的部分,我希望在内容加载后包含div的动画变大,所以看起来好像内容只是被''overflow:hidden'隐藏了整个时间。


如果事先不知道最后的div高度,这可能吗?


我认为如果我可以测试div的内容是否被隐藏是可能的在javascript中,虽然一小时的谷歌搜索和拖钓各种论坛只产生了一个类似的问题,专家交流(我宁愿不订阅只是为了找出接受的回应是不可能)


提前谢谢你,

- Rennat

I have a link that load a section of my page into a div, the div height is set to 0px and overflow is set to hidden.

I have had no problems getting the section to load from an external file, I would just like the containing div to animate getting larger after the content loads so it appears as though the content was just hidden by ''overflow: hidden'' the entire time.

Is this possible without knowing the final div height beforehand?

I figured it would be possible if I could test if the content of the div was being hidden in javascript, although an hour of googling and trolling various forums has yielded nothing but a similar question asked on Experts-Exchange (which I''d rather not subscribe to just to find out the accepted response was "not possible")

Thank you in advance,
- Rennat

推荐答案


我哈有一个链接,将我的页面的一部分加载到div中,div高度设置为0px,溢出设置为隐藏。


我没有问题让部分加载从外部文件开始,我想在内容加载后让包含div的动画变得更大,所以看起来好像内容只是被''overflow:hidden'隐藏了整个时间。


如果事先不知道最后的div高度,这可能吗?


我认为如果我可以测试div的内容是否隐藏在javascript中是可能的,尽管一个小时的谷歌搜索和拖钓各种论坛只产生了一个类似的问题,专家交流(我不想订阅只是为了找出接受的回应是不可能)


提前谢谢,

- Rennat
I have a link that load a section of my page into a div, the div height is set to 0px and overflow is set to hidden.

I have had no problems getting the section to load from an external file, I would just like the containing div to animate getting larger after the content loads so it appears as though the content was just hidden by ''overflow: hidden'' the entire time.

Is this possible without knowing the final div height beforehand?

I figured it would be possible if I could test if the content of the div was being hidden in javascript, although an hour of googling and trolling various forums has yielded nothing but a similar question asked on Experts-Exchange (which I''d rather not subscribe to just to find out the accepted response was "not possible")

Thank you in advance,
- Rennat



如果你使用jquery库,你可以很容易地为div设置动画。它甚至为它提供了一些功能 http://docs.jquery.com/Effects


如果你想写自己的不太难


制作一个功能


函数调整大小(大小){


}


然后设置超时


var t = window.setTimeout(" resize(100,0)",100);


函数调整大小(大小,当前){

if(current< = size){

i = current + 5;

document.getElementById(" thediv")。s​​tyle.height = i;

t = window.setTimeout(" resize(100," + i +")",100);

}

}



这只是一个例子..请亲自试试,如果您有任何问题请告诉我们......或者回复示例中令您困惑的部分。
if you want to write your own its not too hard


make a function

function resize(size) {

}

then set a timeout

var t = window.setTimeout("resize(100, 0)", 100);

function resize(size, current) {
if (current <= size) {
i = current + 5;
document.getElementById("thediv").style.height = i;
t = window.setTimeout("resize(100, "+i+")", 100);
}
}


this is just an example.. try it for yourself and let us know if you have any problems... or post back the portions of the example that confuse you.


你好Rennat,


我有一个叫xSlideCorner的东西哪个会做你想要的。这是使用它的演示。以下是来源和文档


作为参考我还有其他动画演示


我不只是试图让你使用我的代码 - 但我认为看看我是如何实现它可能会有所帮助它。它应该给你一些想法。
Hi Rennat,

I have something called xSlideCornerTo which will do what you want. Here is a demo that uses it. Here is the source and docs.

For reference I have other animation demos.

I''m not just trying to get you to use my code - but I think it might be helpful to just see how I''ve implemented it. It should give you some ideas.


这篇关于用.innerHTML写的内容后动画div大小的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆