欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！

您现在的位置是：首页 > web前端

js实现的美女瀑布流效果代码_javascript技巧

程序员文章站 2022-04-01 17:22:42

...

<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>瀑布流以及回顶部的效果</title>
<style type="text/css"> 
*{ 
margin:0; 
padding:0; 
} 
h1{ 
text-align:center; 
height:100px; 
} 
body{ 
background-color:RGB(232,231,226); 
} 
.all{ 
margin:0 auto; 
width:1000px; 
} 
.number{ 
float:left; 
width:225px; 
} 
.content 
{ 
margin:5px; 
background-color:white; 
} 
img{ 
margin:5px; 
} 
.loading{ 
position: absolute; 
width:100%; 
height:40px; 
display:none; 
text-align:center; 
background-color:RGB(189,203,207); 
} 
#toTop 
{ 
position:fixed; 
_position:fixed; 
font-size:12px; 
color:Blue; 
width:15px; 
text-align:center; 
right:300px; 
bottom:100px; 
cursor:pointer; 
background-color:RGB(243,247,251); 
display:none; 
} 
</style>
<h1 id="h1">I like TRY</h1> 
<div id="all" class="all"> 
 
 
 
 
</div> 
<div id="loading" class="loading"> 
<img onerror="this.src='/statics/superweb999/images/image_error.jpg'"src="/default/index/img?u=aHR0cDovL2ZpbGVzLmpiNTEubmV0L2ZpbGVfaW1hZ2VzL2FydGljbGUvMjAxMjExLzIwMDgwMzEzMTAzNjE3NTQzNi5naWY=" alt="js实现的美女瀑布流效果代码_javascript技巧" title="js实现的美女瀑布流效果代码_javascript技巧">
</div> 
<div id="toTop"><span>△回顶部</span></div>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

相关标签：瀑布流

上一篇：优秀程序员思考、学习新技术的原则和方式

下一篇：如何让div span等元素能响应键盘事件操作指南_javascript技巧

推荐阅读