这个网站是一个具有响应式设计的网页,主要包含三个部分:导航栏、幻灯片展示和图片轮播。在页面加载完成后,会自动执行一系列的JavaScript代码来实现这些功能。
通过$(document).ready()
函数,当文档加载完成后,会执行其中的代码。在这个例子中,代码主要是针对.mainNav
类名的元素应用subNav
插件,实现子导航的功能。插件参数设置了动画速度为400毫秒,滑动效果为开启,鼠标悬停时有提示信息,并默认显示“home”选项卡。
为#mw_slideJs
和#mw_slideJsPro
两个元素应用slideLR
插件,实现图片左右滑动的效果。插件参数设置了动画速度为1000毫秒,滚动效果为开启,滚动持续时间为2500毫秒。
将.transparent
类名的元素的透明度设置为0.8,使背景半透明。接着,为.fu_banner
类名的元素添加淡入动画,动画持续时间为500毫秒。在动画完成后,再为.fu_banner img
元素添加淡入动画,持续时间为3000毫秒。最后,使用setTimeout()
函数设置一个延时器,在8000毫秒后隐藏.fu_banner
元素。
计算页面宽度与2减去500的差值,并将.page_body
类名的元素的左边距设置为该值。这样可以使页面内容在水平方向上居中显示。