<script language="javascript" type="text/javascript">
var Rimifon = {
"Ads" : new Object,
"NewFloatAd" : function(imgUrl, strLink)
{
var ad = document.createElement("a");
ad.DirV = true;
ad.DirH = true;
ad.AutoMove = true;
ad.Image = new Image;
ad.Seed = Math.random();
ad.Timer = setInterval("Rimifon.Float(" + ad.Seed + ")", 50);
this.Ads[ad.Seed] = ad;
ad.Image.Parent = ad;
ad.style.position = "absolute";
ad.style.left = 0;
ad.style.top = 0;
ad.Image.src = imgUrl;
ad.Image.onmouseover = function(){this.Parent.AutoMove = false;}
ad.Image.onmouseout = function(){this.Parent.AutoMove = true;}
if(strLink)
{
ad.href = strLink;
ad.Image.border = 0;
ad.target = "_blank";
}
ad.appendChild(ad.Image);
document.body.appendChild(ad);
return ad;
},
"Float" : function(floatId)
{
var ad = this.Ads[floatId];
if(ad.AutoMove)
{
var curLeft = parseInt(ad.style.left);
var curTop = parseInt(ad.style.top);
if(ad.offsetWidth + curLeft > document.body.clientWidth + document.body.scrollLeft - 1)
{
curLeft = document.body.scrollLeft + document.body.clientWidth - ad.offsetWidth;
ad.DirH = false;
}
if(ad.offsetHeight + curTop > document.body.clientHeight + document.body.scrollTop - 1)
{
curTop = document.body.scrollTop + document.body.clientHeight - ad.offsetHeight;
ad.DirV = false;
}
if(curLeft < document.body.scrollLeft)
{
curLeft = document.body.scrollLeft;
ad.DirH = true;
}
if(curTop < document.body.scrollTop)
{
curTop = document.body.scrollTop;
ad.DirV = true;
}
ad.style.left = curLeft + (ad.DirH ? 1 : -1) + "px";
ad.style.top = curTop + (ad.DirV ? 1 : -1) + "px";
}
}
}
</script>
<div></div>
<script language="javascript" type="text/javascript">
Rimifon.NewFloatAd("/pic/index/images/sypf.gif", "http://www.gtja.com/index/10year/test.swf");
//var ad = Rimifon.NewFloatAd("http://www.google.com/intl/zh-CN/logos/Logo_60wht.gif","http://www.google.com/");
//ad.style.left = 400;
//ad.style.top = 300;
//ad.Image.width = 176;
//ad.Image.height = 77;
</script>
分享到:
相关推荐
HTML部分可能有一个链接到QQ的图片或SVG元素,CSS用于设置漂浮效果和浏览器兼容性处理,而JavaScript可能用于监听页面滚动事件,动态调整漂浮窗口的位置。 **详细知识点讲解** 1. **HTML基础**:HTML(HyperText ...
这段代码示例展示了如何在一个符合W3C标准的文档中实现一个简单的漂浮广告效果。通过对文档类型声明、基本HTML结构以及JavaScript实现细节的理解,我们可以更好地掌握如何在Web开发中遵循最佳实践。此外,还可以...
5. **jQuery插件**:如果使用了jQuery,可能会有一个插件来简化跨浏览器的兼容性工作,如`jQuery.floatThead`或类似的解决方案。 6. **响应式设计**:现代网页设计通常会考虑不同设备和屏幕尺寸的兼容性,因此代码...
- **W3C组织**: W3C(World Wide Web Consortium)即万维网联盟,是一个国际性的标准化组织,致力于制定并推广Web技术的标准。W3C的目标是确保Web技术能够长期稳定发展,并且能够满足市场需求。 - **主要规范**: -...
JS漂浮广告是一种常见的网页广告形式,它通过JavaScript脚本控制广告元素在页面上动态移动,通常表现为一个小图片或广告条,沿着屏幕边缘来回滚动。这类广告能够吸引用户的注意力,提高广告的可见度。在本文中,我们...
标题中的“基于JavaScript代码实现随机漂浮图片广告”和描述中的“符合W3C标准的漂浮代码”指出了知识点的核心:使用JavaScript语言在遵守W3C标准的前提下,创建能够在网页中随机移动的图片广告。 首先,什么是W3C...
这段代码主要展示了如何在网页上实现一个兼容各主流浏览器的带有关闭按钮的浮动多组图片广告功能。这个功能是通过JavaScript实现的,涉及到的核心技术包括事件处理、页面滚动位置获取以及浏览器兼容性处理。 首先,...
Web标准是一组由万维网联盟(W3C)制定的指导原则,旨在提高网络的互操作性、可访问性和可维护性。遵循Web标准的代码意味着使用语义化的HTML、有效的CSS和可访问的JavaScript,以确保网站在不同浏览器和设备上都能...
xScrollStick是一个用于Web页面的JavaScript特效,它的核心功能是让页面上的某些元素能够随着滚动条的移动而保持相对于浏览器窗口的固定位置。这种效果在网页设计中常用于制作浮动菜单、广告条、侧边栏等元素,即使...
以下是一个简单的首页图片漂浮效果的示例代码分析: ```html <!-- 首页图片漂浮开始 --> <script type="text/javascript" language="javascript"> // 添加事件监听器函数,兼容不同浏览器 function addEvent(obj,...
《jQuery实现网页右侧漂浮QQ在线客服插件详解》 在网页设计中,提供便捷的在线客服功能是提升用户体验和促进客户沟通的重要手段。...对于需要在网页上集成在线客服功能的开发者来说,这是一个值得参考和实践的实例。