今天给大家分享一款基于Ascensor.js全屏切换页面插件,这款实例 适用浏览器:IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗。效果图如下:

在线预览   源码下载

实现的代码。

html代码:

 <div id="general">
        <div id="content">
            <!--Contenu1-->
            <div>
                <div class="contenu">
                    <h1>
                        <img src="data:images/logo.png" /></h1>
                    <p>
                        适用浏览器:IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗.
                    </p>
                </div>
            </div>
            <!--Contenu2-->
            <div>
                <div class="contenu">
                    <h2>
                        <img src="data:images/operation.png" /></h2>
                    <pre class="prettyprint">
&lt;script src="js/jquery.min.js" type="text/javascript"&gt;&lt;/script&gt;
&lt;script src="js/jquery.scrollTo.js" type="text/javascript"&gt;&lt;/script&gt;
&lt;script src="js/jquery.ascensor.js" type="text/javascript"&gt;&lt;/script&gt;
&lt;script src="js/myscript.js" type="text/javascript"&gt;&lt;/script&gt;</pre>
                </div>
            </div>
    </div>

via:http://***/Article/19106

基于Ascensor.js全屏切换页面插件的更多相关文章

  1. 关于最近在做的一个js全屏轮播插件

    最近去面试了,对方要求我在一个星期内用原生的js代码写一个全屏轮播的插件,第一想法就是跟照片轮播很相似,只是照片轮播是有定义一个宽高度大小已经确定了的容器用来存储所有照片,然后将照片全部左浮动,利用m ...

  2. Fullpage.js全屏滚动jQuery插件

    兼容性: 支持 IE8+ 及其他现代浏览器. 主要功能: 1.支持鼠标滚动: 2.支持前进后退键盘控制; 3.多个回调函数; 4.支持手机.移动设备; 5.支持窗口缩放自动调整; 6.可设置滚动宽度. ...

  3. 原生JS实现全屏切换以及导航栏滑动隐藏及显示——重构前

    思路分析: 向后滚动鼠标滚轮,页面向下全屏切换:向前滚动滚轮,页面向上全屏切换.切换过程为动画效果. 第一屏时,导航栏固定在页面顶部,切换到第二屏时,导航条向左滑动隐藏.切换回第一屏时,导航栏向右滑动 ...

  4. jQuery鼠标滚动垂直全屏切换代码

    体验效果:http://hovertree.com/texiao/jquery/68/ 源码下载:http://hovertree.com/h/bjaf/f643upc4.htm 代码如下: < ...

  5. HTML5实现网页的全屏切换

    使用HTML5提供的JavaScript Api可以实现主流浏览器的全屏和退出全屏操作,封装成进入全屏和退出全屏的函数如下: //进入全屏 function enterFullScreen() { v ...

  6. jquery简单的大背景banner图片全屏切换

    详细内容请点击 这个是我初毕业刚进公司那会帮同事(同时也是同学)写的一个PC端的全屏图片切换效果,对于刚毕业的我来说写出来那会的喜悦之情是无法言表的,那时的我还是什么不懂的小白白,俗称菜鸟.个人网站上 ...

  7. JS全屏漂浮广告、移入光标停止移动

    点击这里查看效果 以下是代码: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Ty ...

  8. [HTML]JS全屏代码

    video全屏参考:https://www.thecssninja.com/javascript/fullscreen <!doctype html> <html> <h ...

  9. VirtualBox全屏切换

    用VirtualBox的时候,如果设置为全屏,想再切换回来,没有什么菜单,只有通过键盘的快捷键来操作,才可以恢复. 我常常忘掉,所以老是得去找,以后需要记住这几个按键的快捷键. 1.全屏与非全屏切换: ...

随机推荐

  1. nginx 反代理google

    ./configure \ --prefix=/usr/share/nginx --conf-path=/etc/nginx/nginx.conf --http-log-path=/var/log/n ...

  2. eclipse添加js,html,jsp编辑输入补充提示

    1.打开eclipse→Windows→Preferences→Java→Editor→Content Assist 修改Auto Activation triggers for java的值为:zj ...

  3. 【HDU 5810多校】Balls and Boxes(打表/数学)

    1.打表找规律,下面是打表程序: #include <iostream> #include <cstdio> #define ll long long #define N 10 ...

  4. JavaScript读二进制文件并用ajax传输二进制流

    综合网上多个教程,加上自己实践得出的方法,目前能够兼容谷歌.IE11.IE10. htmlbody里的内容,没什么特殊的. <div id="dConfirm"> &l ...

  5. 160907、CSS 预处理器-Less

    CSS 预处理器是什么?一般来说,它们基于 CSS 扩展了一套属于自己的 DSL,来解决我们书写 CSS 时难以解决的问题: 语法不够强大,比如无法嵌套书写导致模块化开发中需要书写很多重复的选择器: ...

  6. ZOJ 1067 Color Me Less

    原题链接 题目大意:一道类似于简单图像压缩的题目.给定一个调色板,然后把24位真彩色按照就近原则聚类. 解法:每个像素的色彩都是RGB三个值,相当于三维空间的一个点.所以当一个新的像素进来时,分别和调 ...

  7. spark1.5引进内置函数

    在Spark 1.5.x版本,增加了一系列内置函数到DataFrame API中,并且实现了code-generation的优化.与普通的函数不同,DataFrame的函数并不会执行后立即返回一个结果 ...

  8. java 字符串String操作工具类

    /** * StrKit. */ public class StrKit { /** * 首字母变小写 */ public static String firstCharToLowerCase(Str ...

  9. 安装Hadoop系列 — 导入Hadoop源码项目

    将Hadoop源码导入Eclipse有个最大好处就是通过 "ctrl + shift + r" 可以快速打开Hadoop源码文件. 第一步:在Eclipse新建一个Java项目,h ...

  10. CPU的ADDR2为什么跟SDRAM的0地址线接在一起

    出处:http://www.100ask.org/bbs/forum.php?mod=viewthread&tid=11544&fromuid=5490 最近看到坛子里很多初学者对于C ...