css 可移动元素,使用CSS移动元素

YOU如何更改CSS以将其移至页面的另一部分？使用CSS移动元素

功能：

$(document).ready(function(){

$(".cb-enable").click(function(){

var parent = $(this).parents('.switch');

$('.cb-disable',parent).removeClass('selected');

$(this).addClass('selected');

$('.checkbox',parent).attr('checked', true);

});

$(".cb-disable").click(function(){

var parent = $(this).parents('.switch');

$('.cb-enable',parent).removeClass('selected');

$(this).addClass('selected');

$('.checkbox',parent).attr('checked', false);

});

});

.gif文件的重复性质似乎乱了定位我。

我想它在出现在右边多一点

* { margin: 0; padding: 0: }

body { font-family: Arial, Sans-serif; }

.cb-enable, .cb-disable, .cb-enable span, .cb-disable span { background: url

(switch.gif) repeat-x; display: block;float: left;}

.cb-enable span, .cb-disable span { line-height: 30px; display: block; background-

repeat: no-repeat; font-weight: bold; }

.cb-enable span { background-position: left -90px; padding: 0 10px; }

.cb-disable span { background-position: right -180px;padding: 0 10px; }

.cb-disable.selected { background-position: 0 -30px; }

.cb-disable.selected span { background-position: right -210px; color: #fff; }

.cb-enable.selected { background-position: 0 -60px; }

.cb-enable.selected span { background-position: left -150px; color: #fff; }

.switch label { cursor: pointer; }

+2

向我们展示html，甚至更好的现场版本，并告诉我们出了什么问题.. –

2012-02-22 11:40:31

+0

repeat-x ..但您可能需要问一些具体问题。 –

2012-02-22 12:09:46

+0

感谢您的复出。以下是常用的代码：此链接中的[link](http://www.frysa.us/experiment.htm)为代码行：.cb-enable，.cb-disable，.cb-enable span，.cb -disable span {background：url(switch.gif)repeat-x;显示：块;浮动：左;} 这里是我调整的一个：[链接](http://www.frysa.us/MyAdjustedExperiment.htm)，这里是调整后的CSS： \t .cb-enable，.cb -disable，.cb-enable span，.cb-disable span {background：url(switch.gif)repeat-x;显示：块;位置：相对;左：120px;} 这里是图像：[链接](http://www.frysa.us/switch.gif) –

2012-02-22 12:18:03