Question

我使用twitter bootstrap设计了一个页面并在其中添加了一个图像滑块（wowslider），现在问题是wowslider没有正确转换。听到了链接......

http://infotechsam.99k.org/quiz.php

当我从标题部分

中删除它时

<link rel="stylesheet" href="css/bootstrap.css" type="text/css" media="screen" />

滑块正常工作..

没有删除bootstrap.css链接的任何解决此问题的方法？我的完整源代码

<!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">
<head>
<title>test</title> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="css/bootstrap.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/bootstrap-responsive.css" type="text/css" media="screen" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="engine1/style.css" />
<script type="text/javascript" src="engine1/jquery.js"></script>
</head>
<body data-spy="scroll" data-target=".subnav" data-offset="50">
    <div id="wowslider-container1">
    <div class="ws_images" id="slider"><ul>
<li><img src="data1/images/img1.jpg" alt="ads" title="ads" id="wows1_0"/></li>
<li><img src="data1/images/img2.jpg" alt="debug" title="debug" id="wows1_1"/></li>
<li><img src="data1/images/img3.jpg" alt="paper" title="paper" id="wows1_2"/></li>
<li><img src="data1/images/img4.jpg" alt="quiz" title="quiz" id="wows1_3"/></li>
<li><img src="data1/images/img5.jpg" alt="www" title="www" id="wows1_4"/></li>
</ul></div>
<div class="ws_bullets"><div>
<a href="#" title="ads"><img src="data1/tooltips/img1.jpg" alt="ads"/>1</a>
<a href="#" title="debug"><img src="data1/tooltips/img2.jpg" alt="debug"/>2</a>
<a href="#" title="paper"><img src="data1/tooltips/img3.jpg" alt="paper"/>3</a>
<a href="#" title="quiz"><img src="data1/tooltips/img4.jpg" alt="quiz"/>4</a>
<a href="#" title="www"><img src="data1/tooltips/img5.jpg" alt="www"/>5</a>
</div></div>
<a class="wsl" href="http://wowslider.com">Auto Slider jQuery by WOWSlider.com v2.4</a>
    <div class="ws_shadow"></div>
    </div>

    <script type="text/javascript" src="engine1/wowslider.js"></script>
    <script type="text/javascript" src="engine1/script.js"></script>
</body></html>

Answer 1

似乎引导规则img { max-width: 100%; }是负责人。

在你的css中添加：

.ws_effect img { max-width: inherit!important; }

twitter bootstrap wowslider jquery的问题

1 个答案: