1

.thumbnaildivを#thumbhiderおよび#thumbcontentdivの外に置くと、クリックイベントは正常に機能し、期待どおりに機能します。現在、そうではありません。

URL： http: //www.samcoles.co.uk/dustbowl/guitars.php

これはオーバーフローと関係があると思います：含まれているdivに隠されていますか？どうすればこれを回避できますか？

javascript：

//this is within $(document).ready function
$(".thumbnail").click(function () {

    var IMAGE_DIR = "images/guitars/";
    var img = $(this).find("img").attr("alt");
    $("#mainphoto").attr("src", IMAGE_DIR + img);
    if(captions) {
        $("#imgcaption").text(captions[img]);
    }
});

css：

div.thumbnail { background-color: #000000; padding: 1px; float: left; width: 69px; height: 69px; cursor: pointer; }
div#thumbhider { width: 673px; height: 70px; overflow: hidden; margin: 0 auto; margin-top: 19px; position: relative; }
div.thumbcontent { height: 70px; background-color: #00ff00; width: 0 auto; display: inline; position: relative; }

html：

<div id="thumbhider">
        <div class="thumbcontent">
            <div style="margin-right:15px;" class="thumbnail"><img alt="1.png" src="thumber.php?img=images/guitars/1.png&amp;h=69&amp;w=69"></div>
            <div style="margin-right:15px;" class="thumbnail"><img alt="10.png" src="thumber.php?img=images/guitars/10.png&amp;h=69&amp;w=69"></div>

            <!--etc....-->

            <div style="clear:both;"></div>
        </div>
    </div>
4

1 に答える 1

3

position:relativeから削除div.thumbcontent

div.thumbcontent {
    height: 70px;
    background-color: lime;
    width: 0 auto;
    display: inline;
    /*position:relative*/
}
于 2012-10-08T21:18:02.633 に答える