js实现轮播图_小型轮播图js

hello,大家好,给大家带来一个小的轮播图;

html代码:

8897c2f376e08ab4d2fa8b0271a90667.png

样式代码:

* { padding: 0; margin: 0; }li { list-style: none; }img { border: none; }body { background: #ecfaff; }.play { width: 470px; height: 150px; overflow: hidden; position: relative; margin: 150px auto 0; }.play .text {width:100%; position:absolute; left:0; bottom:0; height:60px;}.play .text div {position:absolute; left:0; top:0; width:100%; height:100%; background:black; filter:alpha(opacity:40); opacity:0.4; z-index:99;}.play .text span {position:absolute; left:0; top:0; width:100%; height:100%; line-height:60px; color:white; z-index:999; text-align:center; font-size:20px;}ol { position: absolute; right: 5px; bottom: 5px; z-index: 99999; }ol li { float: left; margin-right: 3px; display: inline; cursor: pointer; background: #fcf2cf; border: 1px solid #f47500; padding: 2px 6px; color: #d94b01; font-family: arial; font-size: 12px; }.active { padding: 3px 8px; font-weight: bold; color: #ffffff; background: #ffb442; position: relative; bottom: 2px; }ul { position: absolute; top: 0; left: 0; z-index: 1; }ul li { width: 470px; height: 150px; float: left; }ul img { float: left; width: 470px; height: 150px; }

js的代码:


http://www.niftyadmin.cn/n/1194940.html

相关文章

PyalgoTrade 交易(五)

我们继续采取简单的策略,这次模拟实际交易。这个想法很简单: 如果调整后的收盘价高于SMA(15),我们将进入多头仓位(我们下单买入市价)。如果调整后的收盘价低于SMA(15)&am…

ASP.net(照片列表详细功能CRUD演示)

ASP .net(照片列表详细功能演示) 大家好,今天我们需要讲解的内容就是把上篇文章当中提到的照片列表的很多功能细化去做。 那么之间我们两篇文章的目的就是要让大家深刻体会get,post的使用场景极其作用。像一般处理程序的使用,隐藏域的使用&am…

php修改数据库里面的数据,如何用php修改数据库中的数据

公告: 为响应国家净网行动,部分内容已经删除,感谢读者理解。话题:如何用php修改数据库中的数据回答:详细介绍1 创建userinfo_update.php,用于,先显示,在修改: 先通过GET获…

关于log4j.properties例子:DailyRollingFileAppender

package com.v512.log4j; import org.apache.log4j.Logger; public class HelloLog4J { // 构造记录器,形参是记录器所在的类,表示要在该类做日志 private static Logger logger Logger.getLogger(HelloLog4J.class); /** * param args */ …

marquee 循环显示变量_JavaScript中的for循环

JavaScript 语言中的 for 循环用于多次执行代码块,它是 JavaScript 中最常用的一个循环工具,还可用于数组的遍历循环等。我们为什么要使用 for 循环呢?打个比方,例如我们想要控制台输出1到1000之间的所有数字,如果单写…

linux grep oracle,linux文本处理工具之grep

定义:grep(global search regular expression and print out the line):搜索匹配模式的行,并将其打印出来.pattern:匹配模式,可以文本字符,更多时候是元字符法语:grep [选项] [模式] [文件]常用选项:-i:忽略大小写--color:高亮显示所匹配的字符串-o:只打印显示所匹配的字符串-v…

sqlite字段类型

存储类(Storage Classes) 如前文所述,SQLite在处理数据类型时与其它的数据库不同。区别在于它所支持的类型以及这些类型是如何存储、比较、强化(enforc)和指派(assign)。下面各节介绍SQLite处理数据类型的独特方法和它与域完整性的关系。 对于数据类型,S…

什么是Entitlement

Entitlement(权限),可以想象成App里用于描述该App可以调用哪些服务的字符串。苹果的操作系统(mac os或者iOS)会通过检查这个串,决定这个应用是否可以调用相关功能。比如iCloud权限,推送服务,健康…