2013-06-24 31 views
0

小提琴:http://jsfiddle.net/scottbeeson/TU6Zw/Shennanigans而在右側調整絕對定位的div

HTML:

<div id="itemMap" class="shadow"> 
    <div class="mapHeader">Open Items</div> 
    <div class="mapItem">Test1</div> 
    <div class="mapItem">Test2</div> 
    <div class="mapItem">Test3</div> 
</div> 

CSS:

#itemMap { 
    position: absolute; 
    right: 0px; 
    top: 0px; 
    bottom: 0px; 
    width: 230px; 
    background-color: #f9f3b7; 
    border: 1px solid cornflowerblue; 
    font-size: .8em; 
    z-index: 10; 
} 

的Javascript:

$('#itemMap').resizable({ 
    handles: 'w', 
    minWidth: 180 
}); 
+0

更多信息,請。它似乎在最新的Firefox中運行良好。 –

+0

它在Chrome中不起作用:( –

回答

1

它只是需要一個包裝到w在Chrome中使用ork。見http://jsfiddle.net/gUzCU/

HTML

<div id="wrap"> 
    <div id="itemMap" class="shadow"> 
     <div class="mapHeader">Open Items</div> 
     <div class="mapItem">Test1</div> 
     <div class="mapItem">Test2</div> 
     <div class="mapItem">Test3</div> 
    </div> 
</div> 

CSS

#wrap { 
position: absolute; 
right: 0px; 
top: 0px; 
bottom: 0px; 
width: 230px; 
} 

#itemMap { 
position: absolute; 
top: 0px; 
bottom: 0px; 
width: 230px; 
background-color: #f9f3b7; 
border: 1px solid cornflowerblue; 
font-size: .8em; 
z-index: 10; 
} 
+0

哇,這很有趣......謝謝 –

+0

雖然有可能有更好的方法來做到這一點 –

+0

這是一個概念證明,所以它適用於我:) –

相關問題