滚动广告

最新推荐文章于 2024-07-16 16:43:05 发布
最新推荐文章于 2024-07-16 16:43:05 发布
阅读量104 收藏
点赞数
分类专栏： javascript 文章标签： xhtml javascript ViewUI
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m278261/article/details/83955383
版权
最好的解决方法在最后


<script language="javascript">
<!--

var m_layer1, m_layer2;
function initMove() {
m_layer1 = document.getElementById("divqq");

m_layer1.style.top = "-200px";
m_layer1.style.visibility = 'visible'


MoveLayers();
window.onscroll = MoveLayers;
}
function MoveLayers() {
var x = 5; // 左右边距
var y = 100; // 顶距
var st = document.documentElement.scrollTop;
var cw = document.documentElement.clientWidth;
var y = st + y;
m_layer1.style.top = y + "px";
m_layer1.style.left = x + "px";


}
window.setTimeout("initMove()", 600);
//-->
</script>


<div id="divqq" style="POSITION: absolute;visibility: visible; z-index: 1; top: 404px; left: 5px;"></div>


=============================
以上是老的 。。。。来个简单的

<div id="divqq" style="POSITION: fixed;visibility: visible; z-index: 1; top: 150px; left: 5px;"></div>
--------------
OVER 果断抛弃IE6


==============如果不抛弃IE6的话
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<style type>


.fixed-top {position:fixed;bottom:auto;top:0px;}

</style>
<!--[if IE 6]>
<style type="text/css">
html{overflow:hidden;}
body{height:100%;overflow:auto;}
.fixed-top {position:absolute;top:0;}
</style>
<![endif]-->
</head>
<body>

<p>
1 position: fixed; top: 250px; _position: absolute; margin-left: 25px;
2 _top: expression(document.body.scrollTop + 250);
</p>
<DIV class="fixed-top">XXX</DIV>
<BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR />
<BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR />

<BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR />
<BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR />

</body>
</html>

----------------这个还是有问题

==============最后 来个完美解决的
=======注意 保留 第1 2 两行dtd文件说明和w3标准说明


<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<style type>


/*让position:fixed在IE6下可用! */

.fixed-top /* 头部固定 */{position:fixed;bottom:auto;top:0px;}
.fixed-bottom /* 底部固定 */{position:fixed;bottom:0px;top:auto;}
.fixed-left /* 左侧固定 */{position:fixed;right:auto;left:0px;}
.fixed-right /* 右侧固定 */{position:fixed;right:0px;left:auto;}
/* 上面的是除了IE6的主流浏览器通用的方法 */
* html,* html body /* 修正IE6振动bug */{background-image:url(about:blank);background-attachment:fixed;}
* html .fixed-top /* IE6 头部固定 */{position:absolute;bottom:auto;top:expression(eval(document.documentElement.scrollTop));}
* html .fixed-right /* IE6 右侧固定 */ {position:absolute;right:auto;left:expression(eval(document.documentElement.scrollLeft+document.documentElement.clientWidth-this.offsetWidth)-(parseInt(this.currentStyle.marginLeft,10)||0)-(parseInt(this.currentStyle.marginRight,10)||0));}
* html .fixed-bottom /* IE6 底部固定 */{position:absolute;bottom:auto;top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));}
* html .fixed-left /* IE6 左侧固定 */{position:absolute;right:auto;left:expression(eval(document.documentElement.scrollLeft));}

</style>

</head>
<body>

<p>
1 position: fixed; top: 250px; _position: absolute; margin-left: 25px;
2 _top: expression(document.body.scrollTop + 250);
</p>
<DIV class="fixed-top">XXX</DIV>
<BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR />
<BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR />

<BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR />
<BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR /><BR />

</body>
</html>
m278261
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
手机滚动广告条源码
11-01
手机滚动广告条源码是一种常见的移动应用或网页设计元素，用于展示多个广告或推广内容，通过自动滚动的方式吸引用户的注意力。这种技术在现代移动互联网环境中非常流行，因为它能够有效地利用有限的屏幕空间，同时...
滚动广告字幕
12-11
在IT行业中，滚动广告字幕是一种常见的用户界面（UI）元素，它被广泛应用于网站、应用程序和各种电子屏幕中，以展示促销信息、新闻更新或重要通知。这种设计旨在吸引用户的注意力并有效地传递信息，特别是在有限的...
java 滚动条 滚动_广告条随滚动条的移动而移动
weixin_35674742的博客
02-16 157
文章来源：蓝色理想跟随滚动条的图片#floater{POSITION:absoJavaScript文章来源：蓝色理想跟随滚动条的图片#floater {POSITION: absolute; VISIBILITY: visible; WIDTH: 10px; Z-INDEX: 10}//不知道为什么要定义floater为样式表!...
java开发实战1200例（II）----------069滚动广告字幕
zdm198255的博客
11-20 157
package Test; import java.awt.Color; import java.awt.Font; import java.awt.Graphics; import java.awt.Image; import java.awt.Toolkit; import java.net.URL; import javax.swing.JFrame; import javax.swin...
制作简单的广告条滚动
lhf294的博客
08-21 546
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> *{padding: 0px;margin: 0px;} #list{width: 150px;height: 310px;margin: 0px au
Java——图片滚动显示
学习印记 Learning imprint
04-30 5999
使用java swing，滚动显示图片示例。public class ImageScrollShow extends JFrame { public ImageScrollShow(){ setSize(800, 600); Container c = getContentPane(); Dimension displaySize = Toolk
Android 竖直滚动广告条、上下滚动广告条，View滚动广告条；
Choi晨的博客
06-03 1980
四种方式实现仿淘宝滚动广告条： TextView+Handler延时动画 实现滚动效果； 自定义ViewFlipper 实现滚动效果； RecyclerView+子线程延时 实现滚动效果； 竖直ViewPager+Handler延时 实现滚动效果； 项目已上传Github：https://github.com/CuiChenbo/UpRollView； 其实最早写这个效果是在16年的时候，现在拿出来整理一下，同时也看一下自己之前的代码； Android仿淘宝头条滚动广告条， 之前写的没有传.
滚动广告php,jQuery实现广告条滚动效果实例分享
weixin_42181545的博客
04-10 112
本文主要为大家详细介绍了jQuery实现广告条滚动效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能帮助到大家。*{padding: 0px;margin: 0px;}#list{width: 150px;height: 310px;margin: 0px auto;border: 1px solid #ccc;overflow: hidden;}#list li{list-style...
TextView滚动广告
一把岁月刀的博客
08-24 144
仿今日头条滚动广告自定义TextViewFlipper github地址 ：https://github.com/qingfengwlt/TextBannerDemo
angular 横向自滚动（滚动广告效果）
qq_43730595的博客
01-13 691
横向自滚动 广告等应用场景
Android_RecyclerView实现上下滚动广告条实例（带图片）
08-30
Android RecyclerView 实现上下滚动广告条实例（带图片） Android RecyclerView 是一个强大且灵活的控件，可以用来实现各种类型的列表视图。本篇文章主要介绍了如何使用 Android RecyclerView 实现上下滚动广告条...
Android使用ViewPager实现滚动广告
08-26
在Android开发中，ViewPager是一个非常常用的组件，常用于创建页面滑动效果，比如在应用的启动页、Tab切换或者如本例中所述的滚动广告。本文将详细介绍如何使用ViewPager实现滚动广告。 首先，我们需要理解...
jquery 上下滚动广告
10-29
标题中的“jquery 上下滚动广告”指的是使用jQuery库来实现的一种广告展示效果，该效果使得广告内容能够自动地按照上下方向进行滚动，吸引用户的注意力。描述提到“上下滚动广告实现代码，大家可以自行测试，需要...
如何实现广告图片总是显示在页面上方，并且随滚动条同步移动？
s2940086379的博客
05-21 6545
思路分析： 把广告图片放在一个div中，并且div总是显示在页面的上方 使用getElementById()方法获取层对象，并且获取层在页面上的初始位置 根据鼠标滚动事件，获取滚动条滚动的距离 随着滚动条的移动改变层在页面上的位置 js代码：function move(){ adverObject.style.top=adverTop+parseInt(document.document
HTML的文档类型与字符集＜!DOCTYPE html＞
m0_65696193的博客
07-15 289
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">我们使用的是 html 5 的版本。
更新商品前端接口编写
weixin_55639995的博客
07-12 402
那么在vue运行的时候,会加载所有的ref属性特征的元素还有组件。标签中ref的作用就是将 该组件注册到vue对象的ref属性中。使用插槽,那个scope就是代表着一行的数据。然后里面的选项遍历的是 js定义的数据。如果文字显示过多可以使用 文本隐藏显示。表单绑定还有表单数据的绑定。数据绑定使用的表单绑定状态。写form表单然后封装数据。状态的选择使用的是选择框。副标题使用的是文本域。状态页面使用,下拉框。富文本选择器使用组件。使用后端枚举类型去写。
Sortable.js板块拖拽示例
w11111xxxl的博客
07-14 753
ghostClass: 'blue-background-class' // 拖动时元素的样式类。group: 'shared', // 允许与其它具有相同组名的元素交互。-- 引入 Sortable.js 的 CSS 和 JS 文件 -->width: 150px;/* 减少宽度 */height: 70px;/* 设置高度 */-- 引入 Sortable.js 的 JS 文件 -->animation: 150, // 动画速度。// 初始化 Sortable。
JS+CSS特效：HTML+JS+CSS 实现精致的带二级菜单的头部菜单
最新发布
uu0216的博客
07-16 512
既然a标签把它填满导致了原来的内圆角没有了，而去掉了a标签的背景色依然没有出现圆角。那么我不妨把第一行的两个菜单项和最后一行的两个菜单项写个圆角。这里利用子选择器实现。为了避免菜单项数量改变而导致样式的变化，需要把样式写在最后两个子列表项上，而不是第7和第8上面。所以，在最后两个列表项上，我们使用的 nth-last-child 而不是 nth-child。
html滚动广告栏代码
05-14
此代码将创建一个黑色背景的滚动广告栏，其中包括四个广告内容。将`behavior`属性设置为`scroll`，将`direction`属性设置为`left`可使广告自动向左滚动。`<span>`标签用于包装每条广告内容，并使用CSS样式进行格式化...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值