在jquery中使用索引动画元素
animate element with index in jquery
我想用click事件交换可排序容器中的两个元素,但我做不到。
http://jsfiddle.net/prince4prodigy/rvfYE/
$( "#sortable" ).sortable();
$( "#sortable" ).disableSelection();
$('#click').bind('click', function(){
$('#li-3').animate({index:0},500);
$('#li-1').animate({index:2},500);
});
animate
方法不识别索引属性,该方法主要用于处理数字CSS属性和其他一些特定属性,但您可以使用prepend
和insertAfter
方法更改元素的位置:
var $sortable = $("#sortable").sortable();
$sortable.disableSelection();
$('#click').on('click', function () {
$('#li-1').insertAfter($sortable.children().eq(1));
$('#li-3').prependTo($sortable);
});
http://jsfiddle.net/9uKTY/
使用slideDown
和slideUp
方法的替代方案:
$('#click').bind('click', function () {
$('#li-1').slideUp(400, function () {
$(this).insertAfter($sortable.children().eq(2)).slideDown(400);
});
$('#li-3').slideUp(400, function () {
$(this).prependTo($sortable).slideDown(400);
});
});
http://jsfiddle.net/wwh2D/
正如我在上面的评论中所说:
$(function(){
$("li").click(function(){
//have we clicked on the same item ?
if($(this).hasClass("clicked")){
$(this).removeClass("clicked");
}
// is there an element that allready have been clicked
else{
var firstClicked = $(".clicked");
//if no, this the first clicked element
if(typeof firstClicked == undefined){
$(this).addClass("clicked");
}
else{
swap()....//do your stuff to swapp the elements
}
});
});
相关文章:
- 如何设置html元素填充的动画
- 名称输入的索引
- 如何使用动画实现纸张推车
- 如何在生成下载文件时显示加载动画
- 剑道网格jQuery动画()问题
- EaseJS拖放;放下(动画CC)电影剪辑的鼠标坐标
- 在jQuery中获取表的行索引
- jQuery Lazy加载动画滚动
- jquery动画可以通过编程链接吗
- 测试索引值是否等于某个数字的倍数
- Javascript将数学动画化
- 循环遍历数组中的特定索引
- 按照选项卡索引的顺序循环一个jQuery选择
- 动画.CSS重播
- 制作一个不带HTML a标记但在动画播放完毕后指向其他页面的超链接
- 如何使用jQuery在动画中期加速动画
- 在jquery中使用索引动画元素
- Span文本隐藏的动画DIV尽管z索引
- 如何改变位置和z-索引使用jquery(动画)
- 静态定位菜单和z索引问题,需要保持我的jquery动画