草庐IT

滑动拖动

全部标签

jQuery实现鼠标拖动 html 标签 改变位置、大小——多层级适用和抑制冒泡

*无意侵犯原作者版权,仅学于大众,回馈于大众。*如果平台或者作者认为本人本帖存在侵权或者冒犯,请发邮删贴!!!邮箱:321270064@qq.com最近想自己写一个“傻瓜式”的前端页面生成器,其中有一个想法,就是让未来的用户可以自己更改页面内标签的大小尺寸和位置,通过鼠标就可以完成。因为我本身是写java后端的,对前端的了解是有限的。同时,感觉磨前端也比较费时间的事情。所以,就直接在网上找了一些前端大佬的文献来看了(参考)。以下为参考大佬文献的链接:jQuery实现鼠标拖动div改变位置、大小的实践-H5W3在上述大佬的方法是完全可以实现单一标签节点的大小更改和位置更改的。但是,有还是几个问题

javascript - RxJS:区分单击和拖动

我有一个AngularJS组件,它应该对单击或拖动(调整区域大小)作出react。我开始在我的应用程序中使用RxJS(ReactiveX),所以我试图找到一个使用它的解决方案。请求的Angular方面是次要的......为了简化问题(并训练自己),我根据rx.angular.js拖放示例制作了一个slider指令:http://plnkr.co/edit/UqdyB2请参阅Slide.js文件(其他代码用于其他实验)。这个逻辑的代码是:function(scope,element,attributes){varthumb=element.children(0);varsliderPos

javascript - handsontable/javascript - 禁用通过拖动添加的新行

我有一个动态的handsontable表,这意味着可以在启动后添加数据。然而,问题是,在单击单元格Angular的同时向下拖动时,可以将新行添加到表中。例如,如果用户与按钮交互,我将如何防止用户扩展表格,同时确保我仍然可以添加新行。我试过用afterCreateRow:函数(索引,数量){data.splice(索引,数量)},但这会阻止我使用alter函数添加新行。如果这个问题相当模糊:请参阅下面的链接以获取带有handsontable的默认jsfiddle。单击单元格的一Angular并向下拖动,您会看到。http://jsfiddle.net/warpech/hU6Kz/TL;D

javascript - 与用户操作交互的模态弹出窗口,如用户设置的最大化、最小化、关闭、调整大小和可拖动

我需要与用户操作交互的模态弹出窗口,如下图所示。但是这个模态弹出窗口应该是纯java脚本。严禁使用JQuery或JQuery插件。期待您的来信。提前致谢。 最佳答案 这里我分享一些插件,基本上都是用Jquery和Javascript创建的。无论您在纯JavaScript中寻找什么,都可以使用http://alpha.jspanel.de/media/demos/nojquery/index.php另一个是使用Jquery创建的。是https://lobianijs.com/site/lobipanel#examples使用第一个选项

javascript - 在缩放/拖动时缩放/重绘 d3.js 网格线

我昨天才开始使用d3.js,但在完成我的工作时遇到了一些麻烦。现在我创建了一个带有两个y轴的图表,每个显示一些值,x轴显示日期。点击y轴上的值,我会显示相应的水平网格线。我的问题是,在放大或缩小或拖动时,网格线(水平和垂直)无法根据轴值正确缩放,它们根本就不动。我今天下午进行了很多搜索,找到了一些如何执行此操作的示例,但它们似乎都不适用于我已有的代码。我想,应该将逻辑添加到缩放行为中,但我不确定//xaxisgridlinesfunctionmake_x_gridlines(){returnd3.axisBottom(x).ticks(5)}//addtheXgridlinesletx

javascript - 如何使用 TypeScript 将拖动事件处理程序附加到 React 组件

我正在使用TypeScript(2.4.2)首次涉足React(15.6.1),我正在尝试创建一个组件来表示可拖动的JSON字段。这是我的组件代码:import*asReactfrom"react";interfaceJsonFieldProps{name:string;type:string;indent:number;}exportclassJsonFieldextendsReact.Component{marginStyle={'text-indent':`${this.props.indent*15}px`};render(){return{this.props.name}:{

javascript - 拖动以像在 iPhone 中一样使用 jQuery 更改图像幻灯片

我正在为我的站点使用超大型jquery插件。它带有下一张和上一张幻灯片的按钮。我想在其中实现拖动更改功能。如果有人点击并将鼠标向右移动,它应该充当下一张幻灯片按钮。但是我如何使用jquery来实现呢?我怎么知道用户何时单击n向左/向右拖动http://buildinternet.com/project/supersized/ 最佳答案 jQuery将mouseUp、mouseDown和mouseMove识别为事件。您必须在mouseDown上捕获鼠标位置,在它移动时更新位置并将其与您最初捕获的位置进行比较。虽然这是高度理论化的,但请

javascript - 如何获得这种淡入淡出和滑动效果?

我想知道如何制作像这样的淡入淡出和滑动效果:http://www.apple.com/stevejobs/这是一个非常酷的动画,我想知道这是否可以用jQuery实现?注意:我已经知道如何淡入淡出。我一直使用jQuery。我想要新评论/内存/想法下降的效果。它向下滑动并同时消失。 最佳答案 淡化只是他们在元素上应用的一些CSS:来自messages.css(第81行)#messages#messageContainer#mask{background:-moz-linear-gradient(centertop,rgba(255,25

javascript - jqGrid - 拖动一行以对其进行排序会搞砸单元格宽度

我的问题:当我在jqGrid中拖动一行并完成自定义重新加载功能时,网格的单元格(以前在定义网格时设置的所有不同宽度)被调整为都是一样的宽度。这种情况发生在Webkit浏览器中,但不会发生在Firefox中。代码:我在网格上启用了拖动排序:$mygrid.jqGrid('sortableRows',{update:function(e,ui){sort_grid(e,ui);}});如您所见,我有一个在拖动完成时调用的排序函数,sort_grid。在这里:functionsort_grid(e,ui){varcurrent_grid=$(ui.item[0]).closest('tabl

javascript - 可在特定的 div 内拖动

我正在从事一个使用了可拖动事件的元素。现在的问题是draggable()事件对我来说效果很好......但是因为我想存储我的位置,所以我使用了以下javascript。这个也很好用......但问题是它适用于整个屏幕。我只是希望它仅通过使用此代码在特定的parentdiv上运行。那有可能吗?function$(el){returndocument.getElementById(el);}vartzdragg=function(){return{move:function(divid,xpos,ypos){vara=$(divid);$(divid).style.left=xpos+'p