Categories


Tags


网站侧边栏广告固定浮动效果的实现

对于页面内容很长的网站来说,经常会出现浏览内容的时候,侧栏已经空了,没内容了,这对于网站广告来说非常可以,如果侧栏空了之后能固定一个广告的话,那样对网站和用户双方的体验都不错,下面就说说具体实现的方法。

先在网站加入jquery.js,一般网站都已经加过这个js,因此可以跳过,没有用的网站则需要在网站header部分加入jquery.js代码。

之后,编辑侧栏模板,在侧栏最底部加入广告代码,代码如下:

<div id="float" class="float">

广告的HTML代码

</div>

最后,在网站底部增加如下的javascript代码即可:

$.fn.smartFloat = function() {

var position = function(element) {

var top = element.position().top, pos = element.css("position");

$(window).scroll(function() {

var scrolls = $(this).scrollTop();

if (scrolls > top) {

if (window.XMLHttpRequest) {

element.css({

position: "fixed",

top: 0

});

} else {

element.css({

top: scrolls

});

}

}else {

element.css({

position: pos,

top: top

});

}

});

};

return $(this).each(function() {

position($(this));

});

};

$("#float").smartFloat();

来源:月光博客


Public @ 2009-05-01 15:45:17

Windows系统下FTP(filezilla)的安装配置

1.从filezilla官网下载好安装包后启动安装程序,阅读许可协议,点击【I Agree】进入下一步安装;选择安装内容,默认安装标准即可,点击【Next】(其中“Source Code”是源代码,不需要勾选):1.png2.选择安装路径、选择FileZilla Server的启动方式以及管理端口。共有3种启动方式:将FileZilla Server作为服务安装,随Windows系统启动;将Fil

Public @ 2010-06-19 15:45:56

博客可用性:十大错误设计

写在前面的话:本文将介绍一些关于博客可用性(Weblog Usability)的十个最常见的错误。本文为翻译作品,之所以我要花一晚上的时间翻译这篇文章,因为我看完此文后颇有一些感慨,为了让更多的人了解这篇文章,我将这篇文章进行了翻译,并附加上我自己的观点。初次翻译,翻译的不好,见谅。博客可用性:十大错误设计作者:Jakob Nielsen, 翻译:William Long博客是网站的一种形态,因此

Public @ 2017-04-01 15:45:16

十个JavaScript页面布局技巧

1. 使用弹性盒子布局(Flexbox)来实现多列布局,并确保页面在不同设备上都能流畅地呈现。 2. 使用CSS网格布局来创建复杂的布局,同时保持灵活性和响应性。 3. 使用响应式设计技巧,例如媒体查询和断点,确保页面在不同设备上都能适应和显示。 4. 使用CSS定位来创建浮动、绝对定位和相对定位的元素,并遵循最佳实践以避免出现页面布局问题。 5. 使用基于栅格系统的框架,例如Bootstrap或

Public @ 2023-06-27 18:50:45

更多您感兴趣的搜索

0.503014s