Обработка полос прокрутки с помощью события jQuery Drag and Drop - PullRequest
Новая
       36

Обработка полос прокрутки с помощью события jQuery Drag and Drop

6 голосов
/ 26 июля 2010

У меня есть комнатный диван с несколькими игрушечными кубиками, см. alt text http://i27.tinypic.com/2rwt4t5.jpg

Игрушки расположены абсолютно и могут перемещаться в стенах комнаты. Разделитель контейнера помещения имеет фиксированную высоту и высоту, поэтому в комнате предусмотрены как горизонтальные, так и вертикальные прокрутки. Я использую плагин jquery event drag для настройки DnD. Мне удалось настроить перетаскивание игрушек только в ломитах стены, но при наличии свитков компонент немного перемещается за стену (только до фактической ширины стены).

Я хочу показать только часть игрушки, как показано ниже альтернативный текст http://i30.tinypic.com/jac19i.jpg

Я пытался установить z-index, но безрезультатно, у кого-нибудь есть идея получше?

Ответы [ 3 ]

2 голосов
/ 26 июля 2010

Не видя фактический код, я думаю, переполнение: скрытый может решить эту проблему?

1 голос
/ 11 августа 2010

В приведенном ниже примере показано, что переполнение: скрытый действительно выполняет то, что вы просите. Что-то не так с вашим кодом, но мы не сможем вам помочь, если вы не опубликуете его!

альтернативный текст http://img155.imageshack.us/img155/9594/example1281542227415.png

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Example</title>

        <style type="text/css">

            #container {
                background-color:#ddddff;
                height:300px;
                overflow:hidden;
                position:relative;
                width:300px;
            }

            #container .child {
                background-color:#ddffdd;
                height:50px;
                position:absolute;
                width:50px;
            }

            #container .child1 {
                left:100px;
                top:70px;
            }

            #container .child2 {
                left:270px;
                top:170px;
            }

        </style>
    </head>

    <body>

        <div id="container">
            <div class="child child1"></div>
            <div class="child child2"></div>
        </div>

    </body>
</html>
1 голос
/ 06 августа 2010

Вы можете использовать плагин scrollTo http://demos.flesler.com/jquery/scrollTo/ для работы с полосами прокрутки

...