我有一个网页使用大图像作为背景。我希望使用jQuery加载图像一旦下载(基本上是bing.com加载其背景图像的方式)。这可能与jQuery吗?如果是这样,你会推荐一个插件吗?
解决方法
这个
article可能是有用的。从那里复制:
HTML
<div id="loader" class="loading"></div>
CSS
DIV#loader { border: 1px solid #ccc; width: 500px; height: 500px; } /** * While we're having the loading class set. * Removig it,will remove the loading message */ DIV#loader.loading { background: url(images/spinner.gif) no-repeat center center; }
使用Javascript
// when the DOM is ready $(function () { var img = new Image(); // wrap our new image in jQuery,then: $(img) // once the image has loaded,execute this code .load(function () { // set the image hidden by default $(this).hide(); // with the holding div #loader,apply: $('#loader') // remove the loading class (so no background spinner),.removeClass('loading') // then insert our image .append(this); // fade our image in to create a nice effect $(this).fadeIn(); }) // if there was an error loading the image,react accordingly .error(function () { // notify the user that the image could not be loaded }) // *finally*,set the src attribute of the new image to our image .attr('src','images/headshot.jpg'); });
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。