$('.add-to-list').on('click', function () {
var cart = $('.my-list');
var imgtodrag = $(this).parent('.item').find("img").eq(0);
if (imgtodrag) {
var imgclone = imgtodrag.clone()
.offset({
top: imgtodrag.offset().top,
left: imgtodrag.offset().left
})
.css({
'opacity': '0.5',
'position': 'absolute',
'height': '256px',
'width': '256px',
'z-index': '100'
})
.appendTo($('body'))
.animate({
'top': cart.offset().top + 10,
'left': cart.offset().left + 10,
'width': 75,
'height': 75
}, 1000, 'easeInOutExpo');
setTimeout(function () {
cart.effect("shake", {
times: 3,
distance: 4
}, 200);
}, 1500);
imgclone.animate({
'width': 0,
'height': 0
}, function () {
$(this).detach()
});
}
});
Use with this html :
<div><i class="my-list"></i></div>
...
<div class="item">
<img class="cover_mini" src="..."/></a>
<a class="add-to-list" href="javascript:void(0);" id="42">Add to list</a>
</div>
<div><i class="my-list"></i></div>
...
<div class="item">
<img class="cover_mini" src="..."/></a>
<a class="add-to-list" href="javascript:void(0);" id="42">Add to list</a>
</div>
Be the first to comment
You can use [html][/html], [css][/css], [php][/php] and more to embed the code. Urls are automatically hyperlinked. Line breaks and paragraphs are automatically generated.