Tag: jquery ui

jQuery UI:droppable背景?

我正在尝试创建一个垃圾桶,在你把一些物品放在那里之后,你可以简单地打开它并将任何被丢弃的物品从垃圾箱中拖出来拖出它。 我设置这个的方式是,我的网络应用程序有一个垃圾桶图标,我放下项目,然后单击垃圾桶打开一个包含已删除项目的框,并在黑色透明背景中淡入淡出其他所有内容,这样您就可以专注于垃圾桶框。 代码本质上是 item1 item2 背景CSS设置为固定位置和100%宽度和高度,并设置为droppable。 问题是,当我从垃圾桶中拖出一些东西并将其放在背景上时,即使我将它放在垃圾桶的顶部,它也会被移除。 基本上jQuery不知道trashcanContainer div是在背景div的顶部(因此不是droppable的一部分),即使我定义的z-index高于背景。 我有什么方法可以做这个工作吗?

合并网格表示中的两个div

我有一个4×4网格,我已经通过jquery UI使其可以排序和可选择。 我想做的下一件事是能够合并我选择的两个div,但我完全不知道要去做这件事。 我的第一个想法是试图将它转换为一个表和玩具周围的colspan和rowspan属性,但这将搞乱我的可排序function。 如果有人能指出我正确的方向,我将非常感激。 基本上我可能会重新排序细胞,然后选择两个或更多细胞并合并它们,如果这是有道理的! 我有一个JSFiddle,我到目前为止在这里 1 2 3 4 5 6 7 8 9 10 11 12 $(function() { $( “#selectable” ) .sortable({ handle: “.handle” }) .selectable() .find( “li” ) .addClass( “ui-corner-all” ) .prepend( “” ); }); $(function() { $( “#selectable” ).selectable({ stop: function() { var result = $( “#select-result” ).empty(); $( “.ui-selected”, […]

Jquery ui slider:html中的value,min和max

我正在使用jquery-ui创建一些滑块,我有一个问题如何我可以执行以下操作: 我有这个HTML代码: A range slider: 这是js: $(“.range-slide”).each(function () { var $this = $(this); $(“.slide”, $this).slider({ values: [30, 60], min: 0, max: 100, range: true, slide: function (event, ui) { $(“span.amount”, $this).html(“” + ui.values[0] + ” – ” + ui.values[1]); } }); $(“.range-slide span.amount”).html(“” + $(“.slide”).slider(“values”, 0) + ” – ” + $(“.slide”).slider(“values”, 1)); }); Everyting工作正常但我怎么能这样做: […]

jQuery UI – 使用外部链接在选项卡中打开Accordion

我想在每个外部链接的Tab中打开一个Accordion。 例如:www.demosite.com/site#tab1&2应打开第一个选项卡,并在选项卡内打开第二个手风琴。 到目前为止,我使用以下代码打开特定的Tab: $( “#tabs” ).tabs({ collapsible: true, select: function(event, ui) { window.location.hash = ui.tab.hash; } }); 为了打开手风琴我瘦,我应该使用jQuery UI Accordion的主动function,但我不知道,我如何使用它们。 谁能帮我吗? http://jsfiddle.net/bMeLL

将数据变量从PHP传递到jquery ui对话框

我有这个PHP代码: getPosts() as $post){ ?> <a class="post-link" data-post-id="” href=”javascript:void(0)”> Your idea: <input type="text" name="idea" class="idea" Have a pic? Paste its URL here! (optional) <input type="hidden"class="author" name="author" value="” /> <input type="hidden"class="forpost" name="forpost" value="” /> 我想将post id数据变量传递给jquery ui对话框: $( “#insert-answer” ).dialog({ autoOpen: false, modal:true, buttons: { “Add idea”: function() { var forpost = $(this).data(“post-id”), // HOW CAN […]

JQuery UI Draggable – 如果参数传递给clone(),则返回clone()的Helper函数仅克隆一次

我正在克隆元素,因为它们是使用JQuery的clone()方法从JQuery UI Draggable列表中拖出来的。 查看clone()文档 ,我看到我可以通过将一个或两个布尔参数(true,true)传递给clone()方法来克隆已绑定到这些元素的事件。 通过这些论点,事情变得奇怪了。 如果我只是使用如下所示的clone() ,那么事情就会按预期工作。 $(“.draggable”).draggable({ connectToSortable: “.sortable”, helper: function(e) { return $(this).clone(); } }); 在上面的示例中,我获得了无限的克隆,但是我的事件与克隆的元素相关联也没有被克隆。 那么,当然,我想为这个clone()方法添加一个或两个参数,这样我也可以克隆事件! $(“.draggable”).draggable({ connectToSortable: “.sortable”, helper: function(e) { return $(this).clone(true); } }); 但这使得事情只能克隆一次。 有关示例,请参阅下面的小提琴! 这是clone(true)的小提琴,它只克隆一次: http : //jsfiddle.net/og937wy7/9/ 这里有一个clone()的小提琴,它克隆了很多次。 http://jsfiddle.net/og937wy7/10/

Drupal – 如何在head标签中添加简单的jQuery和jQuery UI?

就个人而言,我不喜欢使用jQuery Update模块,1。看起来像很多不必要的开销,而且2.它只允许更新到jQuery 1.8,这是旧的,如果你问的话,这个模块需要自己更新我! 因此,在加载任何其他js文件之前,我需要在Drupal 7中将以下URL添加到我的head标签中。 Google CDN jQueryurl://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js Google CDN jQuery UIurl://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js 我已经尝试将它放入theme.info文件中,但它来自CDN,所以这不起作用,因为theme.info中的js链接到主题为根的相对路径。 那么,如何在Drupal 7中正常条件下的任何其他脚本之前将其添加到head标签中? 我做了推荐的编辑,由于某种原因,不再为该主题加载CSS文件。 我在这里使用媒体响应主题: https : //drupal.org/project/media-responsive-theme 这是我的theme.php文件的样子: ‘utf-8’ ); } /** * Insert themed breadcrumb page navigation at top of the node content. */ function media_responsive_theme_breadcrumb($variables) { $breadcrumb = $variables[‘breadcrumb’]; if (!empty($breadcrumb)) { // Use CSS to hide titile .element-invisible. $output […]

如何用jQuery手风琴制作嵌套的垂直菜单?

有人能指出我如何使用jQuery手风琴实现嵌套垂直菜单的好例子吗? 像这里的东西(在页面的左边,从第三个项目开始),但嵌套。 由于某些原因,Accordion docs中没有嵌套结构的示例。 或者可能有一个很好的jQuery组件组织垂直嵌套菜单我不知何故错过了(无论基础,不一定是手风琴)? 我相信应该有一个。 你能建议一些具有良好初始设计并且最好容易换肤的吗?

从AJAX(jQuery)加载模态窗口时的绑定元素

我想在模态窗口中设置一个拖拽列表。 窗口的内容是通过AJAX调用加载的,所以我相信我需要使用jQuery的.live()方法。 这是我目前的代码: $(‘#cboxLoadedContent’).live(‘load’, function() { // Event for sortable page lists $(‘ul#pageList’).sortable(); }); 如何加载模态窗口时如何设置绑定? 模态窗口来自colorbox插件。 注意:我猜测’load’不是正确的事件,因为如果我在那里抛出一个简单的alert() ,它甚至不会在窗口加载时出现。

使用Javascript进行Div布局

使用Javascript进行Div布局 如果我点击+它应该打开它再次点击 – 它应该是关闭它工作正常但我需要的是,如果有更多的div如何在运行时处理它们。 #widnow{ width:100%; border:solid 1px; float:left; } #title_bar{ background: #FEFEFE; height: 25px; width: 100%; } #button{ border:solid 1px; width: 25px; height: 23px; float:right; cursor:pointer; } .box{ height: 50%; width: 50%; background: #DFDFDF; float:left; } #title_bar1{ background: #FEFEFE; height: 25px; width: 100%; } #button1{ border:solid 1px; width: 25px; height: 23px; float:right; cursor:pointer; } […]