0

我的代码非常适合 slideToggle 功能,但更多/更少的图像没有交换。在浏览器中本地预览时,图像保持为“更多”。上传版本的行为有所不同。在 Safari 中它切换到空白图像,在 FF 中它使用 alt 文本。

我查看了档案并发现了类似的讨论,但是由于我的代码除了这个小缺陷之外工作正常,我希望不必使用不同的方法,因为我是 jQuery 新手。这一定很简单。我认为就像第二张图片被错误命名一样简单,但这不是问题所在。

这是一个链接http://mentalwarddesign.net/Andrea/Leather/leather.html

这是脚本本身:

<script src="../js-jquery/jquery-1.7.2.min.js"></script>
<script>
$(document).ready(function(e) {
   $('.changeTextButton').click( function() {
       $('.moreText').slideToggle(500)
       if ( $(this).attr('src') == 'img/more-button.png' ) {
                $(this).attr('src','img/less-button.png')
       }
       else {
           $(this).attr('src','img/more-button.png')
       }
   })
});
</script>

这是具体的CSS:

.contentTop {
    width: 540px;
    padding-left: 10px;
    margin-bottom: 20px;
}
.firstText {
    width: 540px;
    padding-left: 10px;
}
.moreText  {
    width: 540px;
    padding-left: 10px;
    display: none;
}
.changeTextButton  {
    display: block;
    cursor: pointer;
    float: right;
    margin-right: 10px;
    margin-top: -18px;
}

这是相关的html:

    <div class="content">
    <div class="firstText">
        <h1><img src="imgLeather/leatherSm.jpg" width="280" height="190" alt="leather" style="float:right;margin:5px 0 0 10px;">Leather Scents</h1>
        <p>After working for several years with different tanneries, Andrea Aromatics has developed what many in our industry acknowledge to be the best leather scents on the market today.  Due to newer tanning methods, some leathers produced today no longer have the desired “traditional” scent.  Another problem is that protective coatings used on some leathers actually impede the natural leather aroma from migrating through the surface.  These polymeric coatings make the leather smell more like plastic.</p>
        <p>Our leather scents have been used by tanneries to increase and enhance the aroma of their quality leathers, as well as by manufacturers of synthetic leather products to make their product simulate the real thing.  We offer leather scents in a variety of forms: liquid, powdered, and pelletized.</p>
      <!-- end .firstText--></div>
    <div class="moreText">
        <p>Natural leather hides can be deodorized and their aroma enhanced by several application methods:</p>
        <ol>
          <li>A water dispersible version of our leather scent can be incorporated into the final bath water to impart scent to the entire hide.</li>
          <li>A concentrated oil soluble version can be mixed into the finishing oil and applied along with it.</li>
          <li>A version can be diluted with alcohol and sprayed onto the “reverse” side.</li>
        </ol>
        <p>We do not recommend mixing the leather scents with proactive leather coatings since they may react and cause discoloration.  A slight yellowing may develop which would be objectionable in “white” or “pale blue” finished leather.  Darker colors and shades are usually not affected.</p>
        <p>We have been supplying our leather scents to the industry for over twenty years.  In that time our scents have been used in both natural and artificial leathers used by several major manufacturers both domestically and abroad.  They have also been used in scented advertising, consumer leather goods, furniture upholstery, toys and sporting goods.</p>
     </div><!-- end .moreText -->
       <img src="../imgGlobal/more-button.png" width="51" height="16" class="changeTextButton" alt="textButton">
      </div><!-- end .content -->

非常感谢任何将我指向罪魁祸首的帮助!

4

2 回答 2

1

../imgGlobal/more-button.png

是图片网址,但您使用的是:img/more-button.png

也许这是图像的错误路径。

于 2012-11-21T17:59:23.080 回答
0

据我所知,您的代码是完美的。

您的问题是,您可能会很高兴听到,您的服务器上不存在该图像。

img/less-button.png 

上传文件或将其更改为您的 JS 中的正确路径

$(this).attr('src','WHEREAMI__img/less-button.png')
于 2012-11-21T18:00:00.293 回答