Jquery 卡鲁弗雷塞尔图像链接

我正在使用CarouFredSel设计一个网站，但是我遇到了一个问题…在我尝试将图片链接到url之前，一切都按预期进行

脚本

如下所示：

$(function() {
    /* Homepage */
    $("#slide-image > div").carouFredSel({
        auto: false,
        items: {
            visible: 2
        },
        next: "#next",
        prev: "#prev",
        scroll: {
            easing: "quadratic",
            items: 1
        },
        width: "100%"
    });
});

<div id="slide-image">
    <div>
        <a href="www.example.com"><img src="images/example.jpg"></a>
    </div>
</div>

$(function() {
    /* Homepage */
    $("#slide-image").carouFredSel({
        auto: false,
        items: {
            visible: 2
        },
        next: "#next",
        prev: "#prev",
        scroll: {
            easing: "quadratic",
            items: 1
        },
        width: "100%"
    });
});

<div class="slide-image">
    <div id="slide-image">
        <a href="www.example.com"><img src="images/example.jpg"></a>
    </div>
    <div class="clear">
        <!-- -->
    </div>
</div>

而

code

看起来像：

$(function() {
    /* Homepage */
    $("#slide-image > div").carouFredSel({
        auto: false,
        items: {
            visible: 2
        },
        next: "#next",
        prev: "#prev",
        scroll: {
            easing: "quadratic",
            items: 1
        },
        width: "100%"
    });
});

<div id="slide-image">
    <div>
        <a href="www.example.com"><img src="images/example.jpg"></a>
    </div>
</div>

$(function() {
    /* Homepage */
    $("#slide-image").carouFredSel({
        auto: false,
        items: {
            visible: 2
        },
        next: "#next",
        prev: "#prev",
        scroll: {
            easing: "quadratic",
            items: 1
        },
        width: "100%"
    });
});

<div class="slide-image">
    <div id="slide-image">
        <a href="www.example.com"><img src="images/example.jpg"></a>
    </div>
    <div class="clear">
        <!-- -->
    </div>
</div>

感谢您的帮助：）

谢谢，
乔希

我想出来了

当我环顾四周时，我发现在CARUFRIEDSL网站上他们有一些技巧和技巧（在页面的中间），他们记录了“使用左浮动的块元素”……在下面的<代码> HTML 它们使用的代码是链接的……所以我只是复制了这一点和PRESTO！p> 因此，现在我的

脚本看起来像：

$(function() {
    /* Homepage */
    $("#slide-image > div").carouFredSel({
        auto: false,
        items: {
            visible: 2
        },
        next: "#next",
        prev: "#prev",
        scroll: {
            easing: "quadratic",
            items: 1
        },
        width: "100%"
    });
});

<div id="slide-image">
    <div>
        <a href="www.example.com"><img src="images/example.jpg"></a>
    </div>
</div>

$(function() {
    /* Homepage */
    $("#slide-image").carouFredSel({
        auto: false,
        items: {
            visible: 2
        },
        next: "#next",
        prev: "#prev",
        scroll: {
            easing: "quadratic",
            items: 1
        },
        width: "100%"
    });
});

<div class="slide-image">
    <div id="slide-image">
        <a href="www.example.com"><img src="images/example.jpg"></a>
    </div>
    <div class="clear">
        <!-- -->
    </div>
</div>

而
code
看起来像：

$(function() {
    /* Homepage */
    $("#slide-image > div").carouFredSel({
        auto: false,
        items: {
            visible: 2
        },
        next: "#next",
        prev: "#prev",
        scroll: {
            easing: "quadratic",
            items: 1
        },
        width: "100%"
    });
});

<div id="slide-image">
    <div>
        <a href="www.example.com"><img src="images/example.jpg"></a>
    </div>
</div>

$(function() {
    /* Homepage */
    $("#slide-image").carouFredSel({
        auto: false,
        items: {
            visible: 2
        },
        next: "#next",
        prev: "#prev",
        scroll: {
            easing: "quadratic",
            items: 1
        },
        width: "100%"
    });
});

<div class="slide-image">
    <div id="slide-image">
        <a href="www.example.com"><img src="images/example.jpg"></a>
    </div>
    <div class="clear">
        <!-- -->
    </div>
</div>



主要的变化是：


我给了内部div一个ID，这导致我的主函数也发生了变化
我正在清除浮动，这有点难看，因为我没有发布我的css（尽管它与下面的示例相同：）

除此之外，代码与我最初发布的完全相同…很高兴这是一个简单的修复-希望这对某人有所帮助

谢谢，

乔希