Позиция jQuery-UI не работает, когда полоса прокрутки - PullRequest
Новая
       4

Позиция jQuery-UI не работает, когда полоса прокрутки

1 голос
/ 03 апреля 2012

Есть две вещи:

  • Или быть придурком
  • Или я нашел ошибку

У меня есть веб-страница с iframe.

Я хочу разместить иконку в левом нижнем углу фрейма. Поэтому я подумал, что смогу сделать это с помощью позиции jquery-ui.

вот моя попытка не работает: 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>test positionLogo</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/redmond/jquery-ui.css"
          type="text/css" media="screen"/>
    <style type="text/css">
        div.positionLogo {
            width: 64px;
            height: 64px;
            position: absolute;
            display: block;
            text-align: center;
            background: #FFFFFF url(http://qooxdoo.org/_media/stackoverflow.png) no-repeat center;
        }
    </style>
</head>
<body>

<h2>Header</h2>

<iframe id="idIframe" name="idIframe" scrolling="no" height="1600px" width="100%" src="http://www.google.it"
        frameborder="0"></iframe>

<div class="positionLogo"></div>

<script type="text/javascript">
    $(document).ready(function () {
        $(".positionLogo").position({
            of:$("#idIframe"),
            my:"left bottom",
            at:"left bottom"
        });
    });
</script>

</body>
</html>

приятно то, что если вы измените высоту опции iframe height="1600px" до height="300px"

Виджет работает правильно! : S

Как это возможно? Спасибо

1 Ответ

5 голосов
/ 03 апреля 2012

То, что вам нужно, это использовать опцию столкновения виджета положения (установите его в none).Значением по умолчанию является переворот, который пытается автоматически настроить положение (для видимой части страницы)

http://jqueryui.com/demos/position/#option-collision

$(document).ready(function () {
        $(".positionLogo").position({
            of:$("#idIframe"),
            my:"left bottom",
            at:"left bottom",
            collision: 'none'
        });
    });
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...