位置: 编程技术 - 正文

用纯CSS+DIV写的漂亮Flash幻灯片及SQL标签教程!(css用什么写)

编辑:rootadmin
用纯CSS+DIV写的漂亮Flash幻灯片及SQL标签教程! 下面代码有点多!但做出来你肯定喜欢! 用纯CSS+DIV写的漂亮Flash幻灯片及SQL标签教程!我不想废话了,开门见山吧。 先看演示 : 点精彩推荐即可看见! 如果下面代码你看不懂或者做不出来,明天等待我的视频吧。 CSS如下: <STYLE type=text/css> <!-- #f_div{width:px; height:px; margin:0 auto; overflow:hidden;} #f_imgDiv{width:%; height:px; overflow:hidden;} #f_img{filter:progid:DXImageTransform.Microsoft.Fade(Overlap=1.); border:0;} #f_infoDiv{width:%;top:-px !important;top:-px; position:relative;} #f_buttonDiv{width:%; height:px; overflow:hidden; text-align:left;} #f_line{width:%;height:1px;background:#fff; overflow:hidden;filter:progid:DXImageTransform.Microsoft.Alpha(startX=0, startY=0, finishX=, finishY=,style=1,opacity=0,finishOpacity=)} #f_buttonDiv div{width:1px;height:px; background:#fff; float:right;} #f_buttonDiv .bg{width:px; height:px; background:#fff; float:right; filter:Alpha(Opacity=);} #f_buttonDiv a{width:px;height:px !important;height:px;float:right;padding-top:5px;color:#fff;font-family:Arial, Helvetica, sans-serif;font-size:px; line-height:px; text-align:center;display:block;overflow:hidden;text-decoration:none;position:absolute;} #f_buttonDiv a:link,#f_buttonDiv a:visited,#f_buttonDiv a:active{color:#;} #f_buttonDiv a:hover{background:#FFC;color:#fff;} #f_buttonDiv a.on:link,#f_buttonDiv a.on:visited,#f_buttonDiv a.on:active,#f_buttonDiv a.on:hover{background:#FFC;color:#fff;} #f_buttonDiv a.on:hover{background:#FF;} --> </STYLE> SQL循 环 体 如下: <div id="f_div"> <!--图片区域--> <div id="f_imgDiv"></div> <div id="f_infoDiv"> <!--数字按钮区域--> <div id="f_buttonDiv"></div> </div> </div> <script> var imgWidth=; var imgHeight=; var _timeOut_=; var show_text = true; //是否显示焦点文字 var timeOut=_timeOut_; var timeOut2=_timeOut_/2;//onmouseout img后需要切换的时间 var now=0; //第一张图 var target="_blank"; //打开方式 var button_on ='on'; //当前焦点对应按钮的样式名 var button_off ='';//非当前焦点对应按钮的样式名 //不可修改区域 var imgUrl = new Array(); var imgText = new Array(); var imgLink = new Array(); var imgAlt= new Array(); //var menuList = new Array();//菜单menu var ver=2; //兼容浏览器版本 默认2 为非ie var firstTime=true; var n =-1; [loop=5] imgUrl[++n]='{$Field(Picurl,Text,0,...,0,)}'; imgText[n]='<a href="{$Field(ID,GetInfoUrl,1,1)}" target="_blank" class=linkblack>{$Field(Title,Text,0,...,0,)}</a>'; imgLink[n]='{$Field(ID,GetInfoUrl,1,1)}'; imgAlt[n]='{$Field(Title,Text,0,...,0,)}'; [/loop] var count=0; for (i=0;i<imgUrl.length;i++) { if( (imgUrl[i]!="") && (imgText[i]!="")&& (imgLink[i]!="")&& (imgAlt[i]!="")) { count++; } else { break; } } function p$(string){ document.write(string); } function $(id){ return document.getElementById(id); } //固定图片size p$("<style> #f_img { width:"+imgWidth+"px;height:"+imgHeight+"px;</style>"); function change(){ if (ver==1){ with($('f_img').filters[0]){ Transition=1; apply(); play(); } } if (firstTime){ firstTime=false;timeOut=_timeOut_/;} else{ $('f_img').src=imgUrl[now]; $('f_img').alt=imgAlt[now]; $('f_imgLink').href=imgLink[now]; for (var i=0;i<count;i++) { $('b'+i).className="button"; //$('f_menu'+i).className=""; } $('b'+now).className="on"; //$('f_menu'+now).className="on"; now=(now>=imgUrl.length-1)?0:now+1; timeOut=_timeOut_; } theTimer=setTimeout("change()", timeOut); } function b_change(num){ window.clearInterval(theTimer); now=num; firstTime=false; change(); } //draw 渐变line (即css:f_line) function draw_line(){ var div = document.createElement("div"); div.id = 'f_line'; $('f_infoDiv').insertBefore(div,$('f_infoDiv').childNodes.item(0)); } //表现层 start //图片 var a = document.createElement("a"); a.id="f_imgLink"; a.target=target; a.href=imgLink[now]; $('f_imgDiv').appendChild(a); var img = document.createElement("img"); img.id="f_img"; img.width=imgWidth; img.height=imgHeight; img.src=imgUrl[now]; img.alt=imgAlt[now]; a.appendChild(img); //数字按钮 for (var i=count-1;i>=0;i--){ var div_bg = document.createElement("div"); div_bg.id = 'div_bg'+i; div_bg.className='bg'; $('f_buttonDiv').appendChild(div_bg); var a = document.createElement("a"); a.id = 'b'+i; a.className = (i==now+1)?"button_on":"button_off"; a.title=imgAlt[i]; a.innerHTML=i+1; a.href='javascript:b_change('+i+')'; $('div_bg'+i).appendChild(a); var div= document.createElement("div"); $('f_buttonDiv').appendChild(div); } //表现层 end $('f_img').onmouseover=function(){window.clearInterval(theTimer);} $('f_img').onmouseout=function(){theTimer=setTimeout("change()", timeOut2);} try{ //滤镜版本 new ActiveXObject("DXImageTransform.Microsoft.Fade"); $('f_img').filters[0].play(); ver=1; draw_line(); } catch (e){ver=2;} var theTimer = setTimeout("change()", _timeOut_/); </script> 别忘了SQL查询语句: -------------------------------------------------------------------------------- select top 5 ID,Title,Adddate,Picurl,Slide,Verific from KS_Article where verific=1 and Slide=1 order by Adddate desc -------------------------------------------------------------------------------- 如果你还不会做或者做不出来更或者看不懂代码,那请告知我,我把视频发出来。

推荐整理分享用纯CSS+DIV写的漂亮Flash幻灯片及SQL标签教程!(css用什么写),希望有所帮助,仅作参考,欢迎阅读内容。

用纯CSS+DIV写的漂亮Flash幻灯片及SQL标签教程!(css用什么写)

文章相关热门搜索词:css dive,div css教程实例,div+css怎么做,用css怎么写,css中div怎么用,css中div怎么用,div css教程实例,用css怎么写,内容如对您有帮助,希望把文章链接给更多的朋友!

解决IE5/IE5.5/IE6/FF的兼容性问题——CSS 转自蓝色理想作者bias原文地址

超赞的随机颜色搭配工具 点激SPIN随机生成一组颜色Flash动画在线播放

CSS2实现的隔行换色 利用了CSS2的相邻选择符IE7以下不支持隔行换色示例:!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Strict//EN""

标签: css用什么写

本文链接地址:https://www.jiuchutong.com/biancheng/372018.html 转载请保留说明!

上一篇:div+css布局必须要知道的css条件注释理论及实践第1/2页(css+div布局的常用方法)

下一篇:解决IE5/IE5.5/IE6/FF的兼容性问题——CSS(解决胃胀气最快方法)

  • 通过法院拍卖取得的设备怎么开具发票
  • 财务要做哪些表
  • 个体户需要税务申报吗?
  • 运输服务的增值税是多少
  • 进出口企业需要具备的资质
  • 费用发票跨月可以入帐吗
  • 待认证进项税期末余额在贷方
  • 公司取现需要带什么东西
  • 机动车发票怎么入账
  • 会计成本核算工作内容
  • 房地产企业销售额排名
  • 个税中的住房租金扣除什么意思
  • 房产税按原值计算公式
  • 铁路运输发票的开具要求
  • 纳税人选择简易办法一经选择
  • 未确认融资租赁费用是什么类型科目
  • 贴现利息可以抵扣吗
  • 税控设备全额抵扣政策
  • 协会会费收入会计科目
  • 个人独资企业改为有限公司
  • 总资产周转率计算公式用不用乘100%
  • 工程预缴税款几个点
  • 银行卡刷卡消费限额
  • 电子发票抬头打印怎么弄
  • 什么是应付债券简单举例
  • 无形资产和长期待摊费用思维导图
  • win 11 发布
  • 政府补助调增还是调减
  • 电脑管家lol修复
  • 企业变更股东要交税吗
  • 网页读出来
  • 罂粟是不是草果
  • 向职工集资计入收入吗
  • PHP:session_name()的用法_Session函数
  • 高校教材pdf
  • 坏账准备的会计科目
  • php 函数返回值
  • 固定资产报废后的处理程序
  • 快递收据能否作为发票
  • 新闻发布管理系统
  • PHP/HTML混写的四种方式总结
  • 附有退回条件的销售商
  • php取mysql查询单条数据
  • 纳税人异地预缴所得税
  • 商业汇票的行为有哪些
  • 营业外收入在现金流量表中填入哪列
  • 土地出让金抵扣进项税
  • 公司能经营烟草公司吗
  • 小额支出没有发票怎么办
  • 出口合同的流程
  • 金税四期的主要内容
  • 库存现金银行存款用什么凭证
  • 月末结转后应交税费应交增值税一般无余额
  • 贴现凭证如何做账务处理
  • 长期待摊的分录
  • 进口货物只有报关单能入账吗
  • 加盟创业成功案例分析
  • 租用的办公室装修费用怎么入账
  • mysql根据另一张表更新
  • xp系统弹出广告怎么处理
  • winxp u盘拒绝访问
  • vcpkgsrv.exe是什么进程
  • mac怎么卸载第三方软件
  • centos配置网络地址命令
  • window资源管理器
  • 桌面工具栏显示
  • Win7升级win10后可以删除2345吗
  • windows向microsoft报告
  • Win10 64位系统下QQ语音和QQ视频音量很小的两种解决方法
  • cocos2dx4.0教程
  • android开发手册
  • python生成随机
  • jquery属性操作
  • JavaScript中的6种运算符总结
  • 北京病退流程
  • 护肤品关税税率
  • 税务逾期未申报是什么意思
  • 营改增后的工程造价怎么算
  • 车辆整备质量怎么填
  • 农副产品营业执照范本
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设