使用 bxslider 脚本制作滑块，但现在 a href 不起作用，可能是啥问题？
Posted
技术标签:
【中文标题】使用 bxslider 脚本制作滑块，但现在 a href 不起作用，可能是啥问题？【英文标题】：Used a bxslider script to make a slider but now the a href is not working, what might be the problem?使用 bxslider 脚本制作滑块，但现在 a href 不起作用，可能是什么问题？ 【发布时间】：2021-11-06 19:11:54 【问题描述】：我使用 bxslider 在我的 blogspot 中放置了一个滑块，但现在链接（书名）不起作用。请参阅 phlawdigest.blospost.com 以查看实际站点。以下是我使用的代码。
Jquery 代码如下：
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<link rel="stylesheet" href="http://bxslider.com/lib/jquery.bxslider.css" type="text/css" />
<script src="http://bxslider.com/lib/jquery.bxslider.js"></script>
<script>
$(document).ready(function()
$('.image-left').bxSlider(
auto: true,
pause: 50000,
// in millisecond
autoHover: true, // pause on hover
autoControls: true,
captions: false,
);
);
html代码如下：
<div class="image-left">
<div>
<img src="URL link/>
<h2><a href = "https://amzn.to/3tu0Bxf"> Book Title One</a></h2>
<p>some text description</p>
</div>
<div>
<img src="URL link"/>
<h2><a href = "https://amzn.to/3tu0Bxf"> Book Title Two</a></h2>
<p>some text description</p>
</div>
</div>
【问题讨论】：
【参考方案1】：bxSlider 支持 jquery3.1.1 并且您不能为您的 html 类提供适当的 css 属性...
<!DOCTYPE html>
<html>
<head>
<title>Try jQuery Online</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.css">
<style>
.selected
color: red;
.highlight
background: yellow;
.image-left
text-align: center;
img
width: 100%;
height: 320px;
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager
text-align: center !important;
</style>
</head>
<body>
<div class="image-left">
<div>
<img src="https://images.pexels.com/photos/50594/sea-bay-waterfront-beach-50594.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500"/>
<h2>
<a href = "https://amzn.to/3tu0Bxf"> Book Title One</a>
</h2>
<p>some text description</p>
</div>
<div>
<img src="https://images.pexels.com/photos/531321/pexels-photo-531321.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500"/>
<h2><a href = "https://amzn.to/3tu0Bxf"> Book Title Two</a></h2>
<p>some text description</p>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.min.js"></script>
<script>
$(document).ready(function()
$('.image-left').bxSlider(
auto: true,
pause: 50000,
touchEnabled: false,
// in millisecond
autoHover: true, // pause on hover
controls: true,
captions: false,
);
);
</script>
</body>
</html>【讨论】：
谢谢。尝试了代码，但当点击没有转到 url 链接时仍然是书名。 @user3266210 如果有帮助，您必须为答案投票【参考方案2】：语法错误：
【讨论】：
以上是关于使用 bxslider 脚本制作滑块，但现在 a href 不起作用，可能是啥问题？的主要内容，如果未能解决你的问题，请参考以下文章