的jQuery UI的位置時滾動條

或者成爲一個混蛋
或者，我發現了一個bug

我有一個iframe的網頁。

我想在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

這怎麼可能？謝謝

來源

2012-04-03 JellyBelly

你需要的是使用position widget的衝突選項（將它設置爲none）。默認值是翻轉它試圖自動調整位置爲你（到頁面的可見部分）

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

$(document).ready(function() { 
     $(".positionLogo").position({ 
      of:$("#idIframe"), 
      my:"left bottom", 
      at:"left bottom", 
      collision: 'none' 
     }); 
    });

來源

2012-04-03 18:07:48 Artem

感謝你這麼多！ – JellyBelly 2012-04-05 13:22:19

的jQuery UI的位置時滾動條

回答

相關問題