大佬教程收集整理的这篇文章主要介绍了Jquery可以在溢出之外隐藏?,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我已经为这两个修复尝试了很多解决方案,但没有运气.这就是我现在所拥有的
CSS
#zidomotac{ width:100%; } #myWorkContent{ width:100%; overflow-x: scroll; white-space: Nowrap; Box-sizing:border-Box; margin-bottom:20px } .slikezamenjanje{ width: 100px; float:left; display: inline-block; vertical-align: middle; } .slikezamenjanje img{ max-height: 120px; overflow:hidden; width: 100%; }
外部
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script> <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript"> $(document).ready(function() { $('.slikezamenjanje').draggable().resizable({ aspectRatio: 16 / 9,}); }); </script>
HTML
<div id="zidomotac"><img src="http://www.vectorimages.org/09/0920100513111825424.jpg"></div> <div id="myWorkContent"> <div class="slikezamenjanje"><img src="http://placekitten.com/200/200/"/></div> <div class="slikezamenjanje"><img src="http://placekitten.com/200/200/"/></div> </div> </div>
这是工作的jsfiddle
http://jsfiddle.net/gorostas/CS93M/
我希望有人能找到解决方案
EDITED
也许我可以先调用resizable然后在draggable里面?
如果我像这样使用拖拽
$(document).ready(function() { $(".slikezamenjanje").draggable({ revert: "invalid",Helper: function(){ $copy = $(this).clone(); return $copy;},appendTo: 'body',scroll: false }); });
我可以移动元素,但它回来的问题?
我改变了什么:
JQuery:
$(function() { $( ".slikezamenjanje" ).draggable({ revert: 'invalid',Helper: 'clone',start: function(){ //hide original when showing clone $(this).hide(); },stop: function(){ //show original when hiding clone $(this).show(); } }); $( "#zidomotac" ).droppable({ //set container droppable drop: function( event,ui ) { //on drop ui.draggable.css({ // set absolute position of dropped object top: ui.position.top,left: ui.position.left }).appendTo('#zidomotac'); //append to container } }); });
我在你的容器上添加了一个droppable状态,所以你可以在里面拖放.
然后我使用drop事件,它允许我获取元素(ui.draggablE)和被删除元素的位置(ui.position).
所以我用.css()设置绝对位置,然后用.appendTo()附加到容器.
对于.draggable(),我只是在隐藏/显示克隆时添加了启动和停止事件来显示/隐藏原始元素.
CSS:
/* Custom style for dropped element */ #zidomotac .slikezamenjanje { position: absolute; }
希望我帮助你;)
以上是大佬教程为你收集整理的Jquery可以在溢出之外隐藏?全部内容,希望文章能够帮你解决Jquery可以在溢出之外隐藏?所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。