1

我正在尝试使用 jquery 效果将图像传输到 div

这是我正在使用的 jquery 代码。

$('#btn-1').click(function() {
    $('#transferEffect').remove(); // Remove any existing one
    $('<style id="transferEffect" type="text/css">' + // Add new one
        '.ui-effects-transfer { background-image: url(' + $(this).attr('src') + '); }' +
        '</style>').appendTo('head');
    $(this).effect('transfer', {to: $('.target')}, 1000);
});

效果很好，但是现在我正在尝试将它与我的代码集成，我似乎无法弄清楚如何在 div 中获取主图像的 id/name/class。

<div class="listing-result-row-holder" >
    <div class="listing-image">
        <a href="google.com"><img src="https://m1-s.licdn.com/mpr/mpr/shrink_60_60/p/3/000/02e/02d/35f521f.png" title="lego" id="img-1" class="img-polaroid" /></a>
        <div class="listing-total-image">1</div>
        <div class="clearfix"></div>
    </div>
    <div class="listing-detail">
        <div class="listing-result-title">
            <span class="listing-badge">bla bla</span>
            <span class="title_browse_ad"><a href="google.com">TITLE</a></span>
        </div>
        <span class="listing-detail-left">
            <div class="listing-more-info">
                <div class="row">RANDOM TEXT</div>
            </div>
        </span>
        <span class="listing-detail-right"></span>
    </div>
    <div class="clearfix"></div>
    <div class="pull-right" style="margin: 0 5px 5px 0;">
        <a href="javascript:void(0);" id="btn-1" name="saveLinkId-1" class="btn btn-link"><span> save</span></a>
    </div>
</div>
<div class="target"></div>

基本上我希望当用户点击“保存”按钮时图像效果开始。这是一个动态生成的页面，所以 ID 会改变（例如 ID #btn-1 可能是 btn-2）

这是我的代码

4

2 回答 2

0

我对您的示例进行了一些更改，但不太确定您期望什么样的效果。希望这对您有所帮助。点击这里

$('#btn-1').click(function() {
    $('#transferEffect').remove(); // Remove any existing one
    $('<style id="transferEffect" type="text/css">' + // Add new one
        '.ui-effects-transfer { background-image: url(' + $(".listing-image img").attr('src') + '); }' +
        '</style>').appendTo('head');
    $(".listing-image img").effect('transfer', {to: $('.listing-image')}, 1000);
});

编辑：

我又做了一些改变。这是更新的链接。

于 2013-04-03T11:23:35.127 回答
0

你可以尝试从 div tag(class pull-right)遍历。像这样

var desId = $('div.pull-right > a ') .attr('id');

如果我没记错的话，我想你可以使用这个 desId 来调用点击事件。

于 2013-04-03T11:45:43.567 回答