滚动数据库
可以用无缝图片滚动效果 如:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
* { margin: 0; padding: 0;}
body{ background-color:#1B1B1B}
#div1{ width: 800px; height: 150px; position: relative; margin: 100px auto;overflow: hidden;}
#div1 ul { width: 800px; height: 150px; position: relative; }
#div1 ul li { height: 150px; float: left; list-style: none; padding-right:20px;}
#div1 ul li img { width: 200px; height: 150px; display: inline-block;}
a{ color: #B4B4B4; }
</style>
<script type="text/javascript">
window.onload=function(){
var odiv = document.getElementById('div1');
var oul = odiv.getElementsByTagName('ul')[0];
var ali = oul.getElementsByTagName('li');
var spa = -2;
oul.innerHTML=oul.innerHTML+oul.innerHTML;
oul.style.width=ali[0].offsetWidth*ali.length+'px';
function move(){
if(oul.offsetLeft<-oul.offsetWidth/2){
oul.style.left='0';
}
if(oul.offsetLeft>0){
oul.style.left=-oul.offsetWidth/2+'px'
}
oul.style.left=oul.offsetLeft+spa+'px';
}
var timer = setInterval(move,30)
odiv.onmousemove=function(){clearInterval(timer);}
odiv.onmouseout=function(){timer = setInterval(move,30)};
document.getElementsByTagName('a')[0].onclick = function(){
spa=-2;
}
document.getElementsByTagName('a')[1].onclick = function(){
spa=2;
}
}
</script>
</head>
<body>
<a href="#" style=" display: block; margin:0 auto; width: 50px;">向左走</a>
<a href="#" style=" display: block; margin:0 auto; width: 50px;">向右走</a>
<div id="div1">
<ul>
<li><img src="img/1.jpg"/></li>
<li><img src="img/2.jpg"/></li>
<li><img src="img/3.jpg"/></li>
<li><img src="img/4.jpg"/></li>
</ul>
</div>
</body>
</html>
㈡ 从数据库提取的图片怎样滚动
我觉得一般用JS和TABLE对图片滚动会有好一点的效果。
我先将取出的图片路径放在了页面的隐藏域中,并且用“,”分隔,然后再通过JS对其进行拆分和CSS样式让其滚动,具体代码如下:
后台在Page_Load的时候先从数据库中取图片:
protected void Page_Load(object sender, EventArgs e)
{
Hidden2.Value = "";
LoginBLL log = new LoginBLL();
DataSet ds = log.GetImage("1");//获取图片信息
if (ds != null && ds.Tables[0].Rows.Count > 0)
{
for (int i = 0; i < ds.Tables[0].Rows.Count; i++)
{
Hidden2.Value += ds.Tables[0].Rows[i]["Image"].ToString() + ","; }
}
}
//前台页面
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Index.aspx.cs" Inherits="Web_Index" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>图片滚动</title>
<meta http-equiv="content-type" content="text/html;charset=gb2312">
<style type="text/css">
.scroll_div {width:920px;margin-top:0px;margin-right: 10px;margin-left: 10px; overflow: hidden; white-space: nowrap;height:65px;padding:10px;}
.scroll_div img {width:101px;height:65px;border: 0;margin: auto 8px; border:1px #efefef solid;}
#scroll_begin, #scroll_end, #scroll_begin ul, #scroll_end ul, #scroll_begin ul li, #scroll_end ul li{display:inline;}/*设置ul和li横排*/
</style>
<script language="javascript">
//滚动图片JS
function ScrollImgLeft(){
var speed=20
var scroll_begin = document.getElementById("scroll_begin");
var scroll_end = document.getElementById("scroll_end");
var scroll_div = document.getElementById("scroll_div");
scroll_end.innerHTML=scroll_begin.innerHTML
function Marquee(){
if(scroll_end.offsetWidth-scroll_div.scrollLeft<=0)
scroll_div.scrollLeft-=scroll_begin.offsetWidth
else
scroll_div.scrollLeft++
}
var MyMar=setInterval(Marquee,speed)
scroll_div.onmouseover=function() {clearInterval(MyMar)}
scroll_div.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
}
</script>
</head>
<body>
<div style="text-align:center;">
<div>
<!--#####滚动区域#####-->
<div style="width:968px;margin-left:5px;float:left;">
<div id="scroll_div" class="scroll_div">
<div id="scroll_begin">
<input id="Hidden2" type="hidden" runat="server" />
<ul><script type="text/javascript">
<!--
var str=document.getElementById("Hidden2").value.split(',');
if(str!="")
{
if(str.length-1<10)
{
var a=parseInt(10/(str.length-1));
for(var j=0;j<a+1;j++)
{
for(var i=0;i<str.length-1;i++)
{
document.write('<li><a href='+str[i]+' target="_blank"><span style="color:#E8E9EB;" ><img src="'+str[i]+'" style="border:0px;width:97px;height:61px;"/></span></a></li> ');
}
}
}
else
{
for(var i=0;i<str.length-1;i++)
{
document.write('<li><a href='+str[i]+' target="_blank" ><span style="color:#E8E9EB;"><img src="'+str[i]+'" style="border:0px;width:97px;height:61px;"/></span></a></li> ');
}
}
}
-->
</script>
</ul>
</div> <div id="scroll_end"></div>
</div></div>
</div>
<script type="text/javascript">ScrollImgLeft();</script>
</div>
</body>
</html>
PS:这个图片滚动如果图片过少,滚动的时候会出现停顿,因此我对图片的数量进行了判断,如若少于十张,会让它按照余数多添加几次跟着滚动。
㈢ 滚动公告,横向滚动数据库中的一条数据,如何实现,sql数据库。(asp.net,VB语言)
把数据库中的数据一次查询出来。然后页面中使用JS控制滚动和每次展现的条数。
㈣ PHP网站 中通过数据库调出图片和文字 怎样实现上下滚动效果
上下滚动的效果属于浏览器端的效果了。PHP是实现不了的。需要用javascript来实现。如果你想要学的话,可以找个jquery的教程。jquery属于javascript的一个框架(就好像Thinkphp对于PHP一样)。jquery还是比较简单容易上手的。很多动画效果都有现成的函数。直接填入参数就可以了
㈤ 怎样实现ASP滚动显示数据库中的记录
你是要怎么滚动,自左向右,还是自上而下?给一个自左向右的。
'连接数据库字符串省去..
'下面是显示代码
<div>
<marquee>
<%dim rssql
set rssql=server.createboject("adodb.recordset")
rssql.open "sql名",conn,1,1
do while not rssql.eof
response.write""&rssql("字段名")&""
rssql.movenext
loop
%>
</marquee>
</div>
<%rssql.close
set rssql=nothing%>
这应该是最简单的滚动了。。
㈥ .net 图片滚动连接数据库问题!
试试这个图片轮播
有12345数字一起切换
有小图大图一起切换
里面有教程和源码
㈦ sqlserver 数据库界面的滚动条怎么设置
css属性 overflow-y:auto; DIV里面的内容超过DIV的高度,右边就会自动出现滚动条
1、用一个div,定制成图中的宽度和高度
2、然后再把div的样式设成overflow-y:scroll,当div里的文字超出那个高度的时候,滚动条就出来了。
例如:<div style="width:100px; height:100px; overflow:auto; border:1px solid #000000;"><img src="" style="width:300px; height:300px;"></div>
㈧ 急!急!如何调用数据库里的动态图片,并且让它滚动,在线等
代码接上: (这是我另外个号)
<table width="536" border="0" class="table3">
<%
if rs.eof or rs.bof then
response.write("<BR> ??¨¤¨¤?àe?Y?T?á???à??ê???2¨|???????¨¤¨¤?àe<BR>") else
rs.pagesize=12 %>
<tr>
<% rs.AbsolutePage=pagecount for i=1 to rs.recordcount if rs.EOF then exit for %>
<td align="center" class="line"><table width="100" border="0" cellpadding="1" cellspacing="0" bgcolor="#FFFFFF">
<tr>
<td><table width="104" cellpadding="0" cellspacing="0" bgcolor="#221E1F">
<tr>
<td height="88" align="center" valign="bottom"><a href="proct_list.asp?ProID=<%=rs("p_id")%>"><img src="<%=rs("p_pic")%>" width="120" height="120" border="0" alt="<%=rs("p_name")%>"></a></td>
</tr>
</table></td>
</tr>
</table></td>
<% if i mod 12 = 0 then %>
</tr>
<tr>
<%end if%>
<%
rs.movenext
if i>=rs.pagesize then exit for
next
end if
%>
</table></td>
</tr>
</table>
<%
rs.close
set rs=nothing
%>
</TD>
</TR>
</TABLE>
</center>
</div>
</BODY>
里面的连接被调用的conn.asp页面就不贴出来了。
达人们,帮帮小弟吧。在线等,小弟分也不多,解决问题后,利马就给分。大家最好贴到DM里去看。
㈨ 怎么实现从数据库取出的数据在页面上显示为超链接并由下向上滚动
while (dr1.Read()) { showMsg1 += dr1["cname"].ToString() +" "; showMsgurl1 += dr1["curl"].ToString(); /*+":" + dr["curl"].ToString() + " ";*/ noticeNum++; Response.Write("<a href="+showMsgurl1+">"+showMsg1+"</a>") } noticeNum--; conn.Close(); 试一下
希望采纳