我刚刚下载并安装了 bxSlider。这似乎正是我想要的，但我遇到了几个问题:我正在使用 Chrome
1) 无论我在哪张幻灯片上，转换后都会显示最后一张幻灯片(第一张幻灯片除外)。
2) 当我尝试调整模式时， slider 变成了它的基本 UL 列表。
过程:
标题代码:
<head>
<!-- NAME THE PAGE -->
<title><?php $title ?></title>
<!-- GET THE FAIRY DUST AND DUST BUNNIES -->
<link rel="stylesheet" type="text/css" href="scripts/basic.css" />
<script type="text/javascript" src="contact-files/contact-form.js"></script>
<script type="text/javascript" src="scripts/jquery.min.js"></script>
<!-- bxSlider -->
<script src="/scripts/jquery.bxslider.min.js"></script>
<link href="/scripts/jquery.bxslider.css" rel="stylesheet" />
<script src="/scripts/muscles.js"></script>
<!-- TELL GOOGLE WHAT IT WANTS TO HEAR -->
<meta name="description" content="<?php $description ?>">
<meta name="keywords" content="<?php $keywords ?>">
<!-- FIX ENCODING ERROR -->
<meta charset="UTF-8">
</head>
头文件:
<!-- =============== -->
<!-- BODY -->
<!-- =============== -->
<body>
<div id="header">
<div class="logo">
</div>
<!-- TITLE -->
<div class="headerwindow">
<div class="logo-box">
<a href="index.php"><img src="/images/logo_white.png" alt="STH Liquidations" class="logo_image" /></a>
</div>
<div class='title'>
<?php
if ($title != "STH Liquidations")
{
echo $title;
}
?>
<p class='contact_info'>Phone: (843) 452-5451</p>
<p class='contact_info'>Monday - Friday: 8:30 - 5:00 PM</p>
</div>
</div>
</div>
<div class="clear"></div>
索引文件:
<?php include "parts/hot_deals.php"; ?>
<p class="head1">Welcome to <strong>STH Liquidations, Inc.</strong></p>
<p>With <strong><i>over ten years experience</i></strong> in the overstock and liquidation business, we at STH Liquidation, Inc feel confident that we can meet your specific needs. STH buys and sells <strong>NAME BRAND</strong> liquidated merchandise from all major retailers, catalog companies and big box stores.
</p>
<p>Whether you are <strong>a retailer, wholesaler, auctioneer, online seller, exporter, flea marketer, mom and pop store,</strong> or whatever you specific venture is, we at STH Liquidations, Inc are confident that we can supply your needs and <strong>help maximize your profits</strong>. We carry truckloads of <a href="general-merchandise.php">general merchandise</a>, <a href="furniture-and-appliances.php">furniture</a>, <a href="housewares.php">housewares</a>, <a href="tools.php">tools</a>, <a href="toys.php">toys</a>, <a href="sporting-goods.php">sporting goods</a>, <a href="jewelry.php">jewelry lots</a>, <a href="apparel-and-shoes.php">apparel</a> and much more.</p>
<p>We carry product from most all major retailers so our customers know that they are getting the name brands they are looking for.</p>
<p>We <strong>DO NOT</strong> buy from others warehouses in which merchandise most likely has been “cherry picked”. We buy and ship direct to the customers from all the major retail reclamation and distribution centers. <strong>Shipping direct from these facilities saves you money.</strong> Another money saving advantage is that our low overhead. Our business philosophy is simple; we keep our costs low so we can keep your costs low. Money saved is money made!</p>
<p>Browse our website at your leisure, but please call us with any questions you may have or to place your order.</p>
<p>Remember to <a href="contact.php">join our mailing list</a> to receive up to date listings and our <strong>hot deals</strong>.</p>
</div>
<div id="hotdeals">
<p class="head2">Hot Deals!</p>
<div class="deals">
<p class="deal_title">K-Hardgoods</p>
<p class="deal_desc">Housewares, toys, tools,sporting goods and much more. Several loads available. See attachment</p>
<p class="deal_price">Price $139 per pallet (single loads)<br />Price $135 per pallet (double load)</p>
<p class="deal_pdf"><a href="PDFs/sth-hot-deal-kmart.pdf">Download PDF</a></p>
</div>
<div class="deals">
<p class="deal_title">SRS Tool Truckload</p>
<p class="deal_desc">CR*STSM*N TOOLS AND MUCH MORE <br />Saws, compressors, blowers, edgers. saber saws, table saws and much more</p>
<p class="deal_price">27 PALLETS--WHLS $66,649.32 <br />SELL PRICE $12,900</p>
<p class="deal_pdf"><a href="PDFs/srs_tools_012914.pdf">Download PDF</a></p>
</div>
<div class="deals">
<p class="deal_title">W*M Power wheels</p>
<p class="deal_desc">Ride on toy truckloads
<br />150-180 units per truckload
<br />Customer returns</p>
<p class="deal_price">Price only $5,900</p>
</div>
</div>
<div class="clear"></div>
<div id="image_holder">
<ul class="bxslider">
<li><img src="/slider/pic1.jpg" /></li>
<li><img src="/slider/pic2.jpg" /></li>
<li><img src="/slider/pic3.jpg" /></li>
<li><img src="/slider/pic4.jpg" /></li>
<li><img src="/slider/pic5.jpg" /></li>
<li><img src="/slider/pic6.jpg" /></li>
</ul>
</div>
(省略页脚，这并不重要)
我的 JS 文件(呈现图像的 UL 列表):
$(document).ready(function(){
$('.bxslider').bxSlider({
mode: fade
});
});
我的 JS 文件(呈现“几乎”有效的幻灯片):
$(document).ready(function(){
$('.bxslider').bxSlider();
});
错误 Chrome Inspect Element 抛出此错误:
Uncaught ReferenceError: fade is not defined muscles.js:3
(anonymous function) muscles.js:3
j jquery.min.js:2
k.fireWith jquery.min.js:2
n.extend.ready jquery.min.js:2
K
我已确保包含下载的所有文件。我已按照我在网站上找到的唯一说明进行操作。谁能看出可能出了什么问题？
最佳答案
我遇到了同样的问题。我通过在 js 文件中设置 useCSS: false 来修复它。当 useCSS 设置为 false 时，bxslider 使用 jQuery animate() 而不是 CSS 转换来进行水平滚动。
关于javascript - 为什么 bxSlider 一直跳到最后一张幻灯片，为什么添加提供的选项会破坏代码？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21974785/