老师我想问一下我的代码为什么不能左右滑动呢-慕课网

首页课程实战体系课手记专栏慕课教程

老师我想问一下我的代码为什么不能左右滑动呢

来源：1-1 课程目标和学习内容

Arlene

2015-04-23 11:39

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head>

<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />

<title>全屏切换--如果不指定宽度，是垂直的</title>

<style type="text/css">

*{padding:0;margin: 0;}

html,body{height: 100%;overflow: hidden;}

#container,.section{height:100%;}

.section{background-position: 50% 50%;background-size: cover;}

#section1{background-color:red;}

#section2{background-color: yellow;}

#section3{background-color: green;}

#section4{background-color: blue;}

.left{float:left;}

#container{width:400%;}

.section{width: 25%;}

</style>

</head>

<body>

<div id="container">

<div id="section1" class="section left"></div>

<div id="section2" class="section left"></div>

<div id="section3" class="section left"></div>

<div id="section4" class="section left"></div>

</div>

</body>

</html>

写回答关注

2回答

purple_yao

2015-04-24 14:33:06

把overflow: hidden;这句话去掉，使用鼠标中间的滑轮滚动实现。

0 0
purple_yao

2015-04-24 14:04:11

不是拖动鼠标的滑动，而是使用鼠标中间的滑轮滚动实现，到这一步，还没有写使用鼠标拖动的方法呢。

0 0

全屏切换效果

如何在PC和移动端实现全屏切换效果，本课程会给你答案

85463 学习 · 154 问题

相似问题

我下载的老师的源代码也不能实现全屏，这是为什么呢

回答 1

为什么资料下载的代码和老师讲解的代码不是一样的？

回答 2

最后一页不滑动整屏幕只滑动一半，然后网页页脚出现怎么弄呢！

回答 1

关于上下滑动

回答 4

为什么检查代码跟老师的完全一样，每张图片的效果不是全屏呢？

回答 5

打开慕课网App查看更多内容