【发布时间】：2013-09-25 12:49:28
【问题描述】：
我在我的网站上使用 Bootstrap v2.3.2、Bootstrap Responsive v2.3.2 和 Supersized 3.2.7。桌面版很好，但在移动设备和平板电脑上我有一个左边距/填充，见下面的截图。我试图删除 bootstrap-responsive.css 的第 804 和 805 行：
@media (max-width: 767px) {
body {
padding-right: 20px;
padding-left: 20px;
}
没有成功。
有谁知道是什么导致了这个问题以及如何解决它？
这是我使用的 HTML 代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title></title>
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
<meta name="description" content="">
<meta name="author" content="">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/bootstrap-responsive.css">
<link rel="stylesheet" href="css/supersized.css" type="text/css" media="screen" />
</head>
<body>
<div class="container-fluid">
<div class="row-fluid">
<div class="span4"></div>
<div class="span4"></div>
<div class="span4"></div>
</div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/supersized.3.2.7.js"></script>
<script type="text/javascript">
jQuery(function($){
$.supersized({
// Functionality
slideshow : 1, // Slideshow on/off
autoplay : 1, // Slideshow starts playing automatically
start_slide : 1, // Start slide (0 is random)
stop_loop : 0, // Pauses slideshow on last slide
random : 0, // Randomize slide order (Ignores start slide)
slide_interval : 11000, // Length between transitions
transition : 1, // 0-None, 1-Fade, 2-Slide Top, 3-Slide Right, 4-Slide Bottom, 5-Slide Left, 6-Carousel Right, 7-Carousel Left
transition_speed : 1000, // Speed of transition
new_window : 1, // Image links open in new window/tab
pause_hover : 0, // Pause slideshow on hover
keyboard_nav : 1, // Keyboard navigation on/off
performance : 3, // 0-Normal, 1-Hybrid speed/quality, 2-Optimizes image quality, 3-Optimizes transition speed // (Only works for Firefox/IE, not Webkit)
image_protect : 1, // Disables image dragging and right click with Javascript
// Size & Position
min_width : 0, // Min width allowed (in pixels)
min_height : 0, // Min height allowed (in pixels)
vertical_center : 0, // Vertically center background
horizontal_center : 1, // Horizontally center background
fit_always : 0, // Image will never exceed browser width or height (Ignores min. dimensions)
fit_portrait : 1, // Portrait images will not exceed browser height
fit_landscape : 0, // Landscape images will not exceed browser width
// Components
slide_links : 'blank', // Individual links for each slide (Options: false, 'num', 'name', 'blank')
thumb_links : 1, // Individual thumb links for each slide
thumbnail_navigation : 0, // Thumbnail navigation
slides : [ // Slideshow Images
{image : 'img/yun_13242.jpg'},
{image : 'img/yun_13242.jpg'}
],
// Theme Options
progress_bar : 1, // Timer for each slide
mouse_scrub : 0
});
});
</script>
</body>
</html>
【问题讨论】：
-
没有超大js的问题你重现了吗？
-
不，只有在使用 Supersized js 时才会发生这种情况。
-
您是否考虑过在网站显示在移动设备上时禁用该插件？
-
是的，但我也想在移动设备和平板电脑上使用该插件。
-
好的。你试过摆弄左边的填充吗？
标签： twitter-bootstrap mobile supersized