Question

我有一个显示framset的弹出窗口，在我的一个框架中，我使用jquery选项卡显示一些文本。

我的问题是，当我尝试显示长文本或当我减小窗口大小时，horizental滚动消失，然后我必须使用垂直滚动到达页面末尾的x滚动。我怀疑是jquery标签，因为当我移除它时，horizental条是固定的。

我尝试使用css attributs，但没有成功。

<script type="text/javascript">
  window.open("windowpoppup.html", "page",'width=1200px,height=400px,left=215px,top=25px,resizable=yes').focus();
</script>

windowpoppup.html

<frameset cols="250,*"> 
    <frame name="displayTabs" src="other.html" marginheight="0" marginwidth="0"     scrolling="auto">
    <frame name="otherContent" src="myTabs.html" marginheight="0" marginwidth="0"     scrolling="auto">
</frameset>

myTabs.html

HTML

<div id="tabs">
<ul style="background-color: white; position: fixed; width: 100%;margin-top: 39px;">
    <li><a class="tab1" id="0" href="#tab1">tab1</a></li>   
    <li><a class="tab2" id="1" href="#tab2">tab2</a></li>
    <li><a class="tab3" id="2" href="#tab3">tab3</a></li>   
</ul>

<div class="div1" id="tab1"><pre>long text</prev></div>
<div class="div2" id="tab2"></div>
<div class="div3" id="tab3"></div>

JAVASCRIPT

$(function() {

$( "#tabs" ).tabs({
  activate: function (event, ui) {
      var index = $('#tabs').tabs('option', 'active');
  } });

  });

Answer 1

根据我的理解，你想让Pop Up响应，所以如果改变窗口大小，你仍然可以滚动。

这可以使用JQuery的 $（window）.resize（）来完成。

// You can customize padding based on your requirement
var paddingBottom = 100;

// Initial value
$('#tabs').height($(window).height() - paddingBottom )

// Resize event
$(window).resize(function(){ $('#tabs').height($(window).height() - paddingBottom ) })

保持水平滚动条固定

1 个答案: