今天给大家分享一款基于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. 原生JS实现全屏切换以及导航栏滑动隐藏及显示——重构前

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

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

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

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

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

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

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

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

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

  7. [HTML]JS全屏代码

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

  8. VirtualBox全屏切换

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

  9. javascript full screen 全屏显示 页面元素

    javascript full screen 全屏显示 页面元素 要想让页面的某个元素全屏显示,就像在网页上看视频的时候,可以全屏观看一样,该怎么实现呢? 一种最简单的方式,就是动态改变你想要全屏显示 ...

随机推荐

  1. HTML &lt;span&gt; 标签

    定义和用法: <span>标签被用来组合文档中的行内元素.在行内定义一个区域,也就是一行内可以被<span>划分成好几个区域,从而实现某种特定效果.<span>本身 ...

  2. 2016CCPC 合肥--最大公约数//每一年通向它的路上,多少人折戟沉沙,多少人功败垂成,有人一战成名,有人从头再来。

    有这样一个有关最大公约数的函数:函数 f(x, y): { c=0 当 y>0: { c +=1 t = x % y x = y y = t } 返回 c * x * x} 给出三个正整数n,m ...

  3. 浏览器XMLHttpRequest案例

    /* Cross-Browser XMLHttpRequest v1.2 ================================= Emulate Gecko 'XMLHttpRequest ...

  4. 2015弱校联盟(1) - E. Rectangle

    E. Rectangle Time Limit: 1000ms Memory Limit: 65536KB 64-bit integer IO format: %lld Java class name ...

  5. 序列化SerialVersionUID

    Java中的SerialVersionUID - Java译站http://it.deepinmind.com/java/2014/05/25/why-use-serialversionuid-ins ...

  6. JS函数调用的方法

    JS函数调用的四种方法:方法调用模式,函数调用模式,构造器调用模式,apply,call调用模式 1.方法调用模式:先定义一个对象,然后在对象的属性中定义方法,通过myobject.property来 ...

  7. Html A标签中 href 和 onclick 同时使用的问题 优先级别

    我们在制作网页的时候用得最多的就是 A 标签 超连接 但有时候需要在 A 里同时用到 href 和 onclick属性 下面我们先来分析一下 ,在不同的浏览器下有不同的效果 1 顺序 ie 6 : h ...

  8. Android --Activity与Fragment通讯

    参考博客:详解Fragment跟Activity之间的通信 Activity中方法 private OnSearchListener mSearchListener; /** *定义一个借口 **/ ...

  9. c# 使用ChartDirector绘图的一些个人体会

    c# 使用ChartDirector绘图的一些个人体会 引言:       最近给客户做一个B/S架构的证券交易大屏幕软件,其中用到对证券指数的走势以及成交量的图形绘制,由于客户要求图形的清晰而且要做 ...

  10. 无责任比较thrift vs protocol buffers

    http://blog.csdn.net/socoolfj/article/details/3855007 最新版本的Hadoop代码中已经默认了Protocol buffer作为RPC的默认实现,原 ...