-1

我在页面上有超过 10-15 个按钮，我只想使用 jquery 左右移动 1 个按钮，但是所有按钮都开始左右移动。即使每个按钮都有不同的类名。请告诉我解决方案。

这是代码：

<script>
    $(document).ready(function() {
        sayNoVisual(100, 1);
    });

    function sayNoVisual(px, r) {
        $('.stepback').animate({
            'marginLeft': px
        }, function() {
            $('.stepback').animate({
                'marginLeft': 1
            }, function() {
                if (r-- > 0) {
                    sayNoVisual(px, r);
                }
            });
        });
    }
</script>

这里是按钮：

 <button type="submit" class="stepback" data-ruleindex="1" > <img alt="Step back" src="46887_106291039431913_6252895_n.jpg" title="step back one cycle" width="60" height="60"></button> 
 <button type="submit" class="stepfwd" data-ruleindex="1"> <img alt="Step forward" src="467_n.jpg" title="step forward one cycle" width="60" height="60"></button>

在代码中，我只使用了第一个按钮类，但两个按钮都从左向右移动。

使用的css类是：

<style type="text/css">
            .stepback, .play, .pause, .stepfwd, .tostart, .toflagback, .toflagfwd, .toend {
                margin:0;
                padding:0;
                border:0;
                outline:0;
                font-size:100%;
                vertical-align:baseline;
                background:transparent
            }

            .stepback:active, .play:active, .pause:active, .stepfwd:active, .tostart:active,      .toflagback:active, .toflagfwd:active, .toend:active {
                position:relative;
                top:3px;
            }

            .stepback:hover, .play:hover, .pause:hover, .stepfwd:hover, .tostart:hover,     .toflagback:hover, .toflagfwd:hover, .toend:hover {
                position:relative;
                top:3px;
            }
        </style>
4

1 回答 1

1 
 <button type="submit" class="stepfwd" data-ruleindex="1"> <img alt="Step forward" src="467_n.jpg" title="step forward one cycle" width="60" height="60"></button> 
<button type="submit" class="stepback" data-ruleindex="1" > <img alt="Step back" src="46887_106291039431913_6252895_n.jpg" title="step back one cycle" width="60" height="60"></button>

请参见此处的示例 - 只需切换左侧的哪个

从技术上讲，只有左边的按钮在移动，但你希望右边的按钮去哪里？它别无选择，除非你改变定位，比如绝对

这里的例子

.stepback{position:absolute;}
.stepfwd{position:absolute;left:100px;}
于 2013-06-22T12:03:47.223 回答