摘要:
我们本章要介绍的是单页导航动画效果的实现,感觉有点拗口,其实我也不知道这个效果动画到底叫什么名字合适。 其实他实现的功能还是好理解的,就是有一个母页面,母页面会加载一定数目的子页面,母页面上有各个子页面的link。默认母页面显示第一个子页面的内容,当点击母页面上的链接时,显示相应子页面的内容。这里的母页面和子页面是实际存在的不同页面,但是整个动画实现的结果是,所有页面的切换都是在母页面上实现的,url并没有发生变化。要是大家还不知道是怎么回事,那就下载demo看运行效果吧,一看便知。 好了不说废话了,开始我们的教程。第一步是创建母页面的html代码。<div id="outer 阅读全文
摘要:
我将上一章中了插件做了个小小的升级,实现了自动运行效果,完整代码大家见demo。 主要的变化点有:把‘下一条’、‘上一条’的click事件抽象到一个函数showNext中。添加setInterval,添加selector元素的hover事件。好了,我们一个个的看。showNext函数://显示函数function showNext(flag) { //隐藏导航 $(config.selector).find('a').css('display', 'none'); //创建遮罩 $.tranzify.createOverlay(config); 阅读全文