的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的位置时滚动条

回答

相关问题