我在相同位置的同一页面上有很多图像。有些小组有opacity = 0
(div),并在想要展示时设置opacity = 1
。
但是,显然,所有图像都在开头加载(93Mb)。
所以,我想根据请求加载图片。加载div的内容和包含的图像。
我从这开始:
if($('#id_of_div').css('opacity') == 1) {
loadTheCode();
}
然后我发现这个(load html after opacity = 0)是由Rory McCrossan在2年前写的:
function cargarContenido(pagina) {
$('#content').animate(
{ "opacity": "0" },
function() {
$("#loadimage").show(); // show a loading image
// load content when opacity = 0 animation finished
$("#content").load(
pagina,
function() {
$("#loadimage").hide(); // hide a loading image
// make opacity = 1 when content has been loaded
$('#content').animate({ "opacity": "1" });
}
)
}
);
}
但是,我不知道这个jQuery函数是如何工作的,如何实现它以及如何重写所需的代码。
当代码加载时,图像也会加载?
可以通过PHP执行MySQL请求吗?
我迷路了:S
非常感谢你!
答案 0 :(得分:0)
jQuery
通常具有函数调用的结构加上callback
,一旦原始函数成功执行,就会调用它。回调是jQuery
中广泛使用的功能,可以异步控制事件和动作。
所以代码执行以下操作,
content
属性移动到0来动画DOM
opacity
元素。由于未指定持续时间,因此默认情况下 400ms (可能有是第二个论点)。jQuery
为opacity
设置动画后,会触发回调函数,其中会显示加载占位符(loadimage
)。.load()
函数似乎调用存储在变量pagina
中的网址。成功执行load事件后,.load()
的另一个回调函数被调用。innerHTML
ID标识的DOM
元素的content
。content
置于不透明度1。因此,您可以在此处调用您创建的服务器上的另一个端点,以仅返回部分页面内容(可能是内部API
)。该API将在内部根据数据的某些有效负载执行任何需要完成的数据库查询。 (请注意,您还可以通过.load()
调用发送一些有效负载。)
在此处查看文档:
.load()
,.animate()
,.show()