html5全屏页面滑块拖到切换代码



199 793 265



特效描述:html5 全屏页面滑块 拖到切换,html5 css3制作图片文字内容全屏层叠、页面滑块拖到切换显示图文内容代码。

代码结构

1. 引入CSS

<link rel="stylesheet" href="css/style.css">

2. 引入JS

<script src="js/main.js"></script>

3. HTML代码

<section id="wrapper" class="skewed">
    <div class="layer bottom">
        <div class="content_wrapper">
            <div class="content_body">
                <h2>iphoneX-front</h2>
                <p>一直以来,我们都心存一个设想,期待着能够打造出这样一部 iPhone:它有整面的屏幕,能让你在使用时完全沉浸其中,仿佛忘记了它的存在。它是如此智能,你的一触、一碰、一言、一语,哪怕是轻轻一瞥,都会得到它心有灵犀的回应。而这个设想,终于随着 iPhone X 的到来成为了现实。现在,就跟未来见个面吧。
                </p>
            </div>
            <img src="img/front.png">
        </div>
    </div>
    <div class="layer top">
        <div class="content_wrapper">
            <div class="content_body">
                <h2>iphoneX-back</h2>
                <p>一直以来,我们都心存一个设想,期待着能够打造出这样一部 iPhone:它有整面的屏幕,能让你在使用时完全沉浸其中,仿佛忘记了它的存在。它是如此智能,你的一触、一碰、一言、一语,哪怕是轻轻一瞥,都会得到它心有灵犀的回应。而这个设想,终于随着 iPhone X 的到来成为了现实。现在,就跟未来见个面吧。
                </p>
            </div>
            <img src="img/back.png">
        </div>
    </div>
	<div class="handle"></div>
</section>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 文字叠加 滑动导航菜单 图片拖动 导航切换 图片叠加 图片全屏 滑动选项卡切换 文字拖动 文字全屏 图片滑动 拖动排序 图片切换 360全景 文字滑动 文字切换 弹出层拖动 滑动手风琴 背景切换 滑动星星打分 手风琴 选项卡自动切换 视频切换 列表切换 渐隐切换 全屏切换 切换按钮 缩放切换 滑动滑过 滚动切换 滑动选项卡切换 拖动拽动 叠加浮动层 选项卡切换 滑动手风琴 全屏焦点图 重叠层叠叠加 全屏切换 宽屏全屏满屏

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到