Problem with width: 'auto' and widget header in IE7 in dialogs
The widget header (.ui-widget-header?) does not display correctly in IE 7 when using width: 'auto'. You can also see this in IE8 by using developer tools> Browser Mode : IE7. To duplicate this issue, download jquery UI from http://jqueryui.com/download, then in index.html, change the width of the dialog to 'auto': // Dialog $('#dialog').dialog({ autoOpen: false, width: 'auto', buttons: { "Ok":
Slider Range Handle (Different Images)
Hi all, I'm trying to use a JQuery range slider, can add an image for the handles (two of them) fine, but I want both handles to have a different image rather than the same one, is this possible? Thanks --
dialog button css
Hi. What class can i use to turn a normal button as a dialog button with behaviour on hover, etc... --
ui-widget-shadow not working?
I used the Overlay & Shadow theming class .ui-widget-shadow to one of my DOM element, but I could not get the expected result. It is showing completely unexpected behavior. What can I do? --
making items draggable that were loaded by ajax
There are several places where this question applies in my project, but this is the first I've hit it and its a clear illustration. I have ui.tab content loaded by ajax I have elements in that content I want to be draggable What is the best way to make this content .draggable() ? if I have other non-ajax-loaded content that is already made draggable - is it OK to call .draggable() on an element more than once? if so, then I could have a script tag at the end of the ajax content that calls $('selector').draggable
Drag and drop between columns
<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns:m="http://schemas.microsoft.com/office/2004/12/omml" xmlns="http://www.w3.org/TR/REC-html40"> <head> <meta http-equiv=Content-Type content="text/html; charset=us-ascii"> <meta name=Generator content="Microsoft Word 12 (filtered medium)"> <style> <!-- /* Font Definitions */ @font-face {font-family:"Cambria Math"; panose-1:2 4 5 3 5 4 6 3 2 4;} @font-face
Accordion: Stop A Change To A Section
Hi Guys, I was wondering how to stop a change between accordion sections? I am aware of the "changestart" event which I can bind to: http://jqueryui.com/demos/accordion/#event-changestart But it seems if I return false it still changes anyway? For example the following doesn't stop the accordion from switching: $(".accordion").accordion({ header: "h3", clearStyle: true, autoHeight: false, change: function(event, ui) { return false; }, changestart: function(event, ui) { return false; } }); Any tips?
another IE 8,7,6 problem
have a terrible problem with IE 8,7,6. Works with Safari and Firefox latest however. jprep.matthewos.com. you'll see what's jquery on the left. i've just put in the jquery UI demo basically. any thoughts on getting this fixed? --
Can YOU build be a new interface for a website?
Hello, I want you to build me a clone of Apples iTunes _interface_ with CSS, XHTML and a JS framework (best would be jqueryui). I will apply the theme myself so what I need is an index.html, css and images in subfolders that loads in a browser and makes an exact COPY of iTunes's gui. Each item should already have a href-tag (javascript:). All text needs to be text not images. All must be done without tables but with css. Please take a look at the attached mockup. - The control buttons (play, stop,
jQuery Slide Overflow Problem in IE6 + 7
Hi, Basically when the button is clicked I wanted the paragraph to slide up, but in IE6 + 7 as soon as the button is clicked and the slide transition begins, it completley seems to override the overflow:hidden' property set to the DIV and shows everything. Here's a quick bare-bones example to illustrate the problem: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type"
Sortable with 3 lists, 2 sub lists, 1 master list & reverse ...
Hi, I know the subject doesn't really do justice to what I'm trying to do here, I think I'm close, I just can't figure out what's next. I have 3 lists, I want both features & widgets to be draggable to the 'active' list. But I only want items with class 'feature' to go BACK to the 'features' list and class 'widget' to go back to 'widgets' list. Understand? Doable?? Here's my code: <ul class="features"> <li class="feature">Name of Feature</li> <li class="feature">Name of Feature</li> <li
Setting a PHP variable from re-sorted list
I'm trying to create a Netflix-queue kind of thing on a PHP/MySQL website. So, what I want to do is have the user drag the list items around to create their desired sort order. When they hit submit, it will update the MySQL database with the updated sort order. I've got a column in my table for the sort number. How do I use the sortable behavior to have it set the sort variable according to the displayed order? Thanks, PirateLenny --
jQuery Interface for a website, who can do it for me? / ADDITIONAL INFOS
Hi again, it must not look EXACTLY like iTunes but the layout must be the same, scrollbars where they are in iTunes, sizeable areas and divs, buttons should be positioned... That should be the same but built with jquery ui. http://hofmann.me/demo.jpg --
Offsetting multiple dialogs
In our framework, there may be multiple jqueryUI dialogs resulting from one ajax transaction. I would like to be able to ensure that dialogs do not overlap each other exactly by offsetting the x and y of each additional dialog by 10 pixels. The trouble is, I can't seem to get a real viewport y and y from the already existing dialogs. I've tried getting .position(), which only gives me 'center', also tried position().left, which seems to give me the left from some relative div, not the viewport. Nothing
Message to jQuery-UI group admins
There's SPAM here that's now two-days old. I know this group is being migrated elsewhere but, until then, can we please continue being prompt and vigilant in cleaning-out SPAM? See, I'm not really interested in helping by occasionally answering questions if group Admins aren't in-here cleaning-up on a daily basis. I know it's not always easy but evidently Admin coverage is slipping and, just so you know, that's not going unnoticed. Thanks lads. **--** Steve --
missing XML setup file in the package.
I have built a download package (with theme) on the jQurey site. when I try to install the package I get the following error. I unzipped the package and searched for an xml file but could not find one. Error! Could not find an XML setup file in the package I am running Joomla! 1.5.14 with safe mode off. Any insight on this? tia, Rand --
Create Period Ranges and min selection limited to 5days with datepicker
Hy all, i am trying to create a 3 month datepicker calendar, that shows, 1-the period range for spring with a green background 2-period for summer with a yellow background 3-autom peridod would be brown... I would also like to display a min range of five days after they have selected their first day that would color five days from selection but that would allow to "extend" that selection into further range of always more than 5 days. Is this posible to achieve, could i get examples on how to taint
Basic Question
I have a very basic question on two different pages. I have 2 pages (links below). On the first one, the datepicker isn't popping up, on the second one the accordion isn't kicking in. This is just for a school project, and I have done the accordion with Rico before, but the jQuery one isn't working for some reason. Thanks for any help! http://einstein.franklin.edu/~larkin04/webd434/courseproject/contact.php - Datepicker not working http://einstein.franklin.edu/~larkin04/webd434/courseproject/tools.php
loopj autocomplete multi item selection
Hi, I am using the plugin from http://loopj.com/2009/04/25/jquery-plugin-tokenizing-autocomplete-text-entry/ I have an issue before I have it working exactly to my liking. If an item has already been selected and in the textfield, the same item shows up in the popup selection anyways. Scince there will be user names going into this textfield I do not want any of them to be available in the popup. Anyone know how to fix this? Also does anyone know how to keep the list of names in the textfield when
jquery ui featured content slider in wordpress
Hi please help - I am a newbie and am just trying to get a featured content slider on my homepage using jquery ui... I have it almost working but the main image won't scroll http://www.infiniteprep.com/?page_id=287 That's the URL where I have it *almost* working. I followed this tutorial: http://webdeveloperplus.com/jquery/featured-content-slider-using-jquery-ui/ Please help! Thanks --
Accordion with dynamic content and collapsible:true issues
As a test I have the following js: <script type="text/javascript"> $(document).ready(function(){ $('#accordion').accordion({change: function(event, ui) { $('#'+ui.newHeader[0].id+'-content').load(ui.newHeader[0].id +'.html'); }}); }); </script> and the following HTML: <div id="accordion"> <h3 id="article1">head1</h3> <div id="article1-content"><img src="ajax-loader.gif" /></div> <h3 id="article2">head2</span></h3> <div id="article2-content"><img src="ajax-loader.gif"
Droppable - setting scope using setter method
I am using jQuery 1.3.2, with jQueryUI 1.7.2 I am building a page that will have multiple similar regions with drag and drop. I want each region to have a different d'n'd scope - that of its containing div e.g. The only differences in the standardised code within the dragAndDropRegion div will be textual and layout positioning. <div class="area1"> <div class="dragAndDropRegion"> ... standardised drag and drop stuff here </div> </div> <div class="area2"> <div class="dragAndDropRegion"> ... standardised
callback after accordion's methods
Hi This is my first post here :) I would like to know how to launch a callback after accordion's methods ie: $('selector').accordion( 'activate' , false,{change:function(){alert ('hello')}}) Regards A. --
get clone img id?
<html> <head> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript" src="js/jquery- ui-1.7.1.custom.min.js"><… <script> $(function(){ var $container = $('#container'); $(".obj").draggable({ cursor: 'move', helper:'clone', scope:'mydrag' }); $container.droppable({ accept: '.obj', activeClass: 'myactive', hoverClass: 'myhover', scope:'mydrag', drop: function(e,ui) { $("img").click(function () { $("#textfield").val($(this).attr("id")… }); $(ui.draggable).clone().appendTo($(th…
JQuery accordion - unbind click event
I am writing a form wizard using JQuery's accordion module. The problem is I want to override any mouse clicks on the accordion menu so that the form is validated first before the accordion will show the next section. I have tried the following: $('#accordion h3').unbind(); $('#accordion h3').click(function() { if (validate()) { $("#accordion").accordion('activate', 2); }else { alert("invalid form"); } } But the above code doesn't work. The built-in click event of the accordion still gets called
JQuery drag and drop - how to get an img id after dragged
<script> $(function(){ var $container = $('#container'); $(".obj").draggable({ cursor: 'move', helper:'clone', scope:'mydrag' }); $container.droppable({ accept: '.obj', activeClass: 'myactive', hoverClass: 'myhover', scope:'mydrag', drop: function(e,ui) { $(ui.draggable).clone().appendTo($(this)).resizable().parent ().draggable({containment: '#container'}); } }); }); </script> <div id="container"> </div>
nested, sortable, show
I have a nested sortable list and I am using toggle to hide li elements but when I want to add to the ul I want to show all the all li's of the ul I'm adding to so I know where i want to put them so I do that like this $('.toggle').live('click',function() { $(this).parent().next("ul").children().toggle('slow'); }); so when I move an li over the ul i want to show('slow) the children of that ul but i'm not show how to trigger that event any help would be appreciated Mean Mike --
Submit form after confirmation Dialog with to be submitted values
Hello, I have been working on submit forms in combination with a confirmation dialog. I would like to have the confirmation dialog pull up the information to be submitted, so that I can check if what's being submitted is correct before hitting the "Confirm" button to submit the information. I'm new with jquery but if I'm not mistaken with the setup I have right now it would not work because the jquery code halts the submit until I click "Confirm". So I was thinking it would be impossible to get the
jQuery UI Datepicker
Hello, Does anyone know how to do this ( http://www.kelvinluck.com/assets/jquery/datePicker/v2/demo/datePickerDefaultToday.html ) but with jQuery UI Datepicker instead. Thanks, KP --
Load Multiple Instances of UI Tabs
Hi there.. I would like to load 4 tab sets on my page , but If I do that, it just loads the first one and others are messed. How can we solve this ? --
JQuery UI tabs
Hi, See I have two files 1) tree.php where i have a code snippet <div id="tabs-test"><!-- tabs-2 div starts .. Second Level of tabs for tab2 --> <ul> <li>Testing</li> </ul> </div> And in dashboard.php <div id="tabs-test"><!-- tabs-2 div starts .. Second Level of tabs for tab2 --> <ul> <li>Testing11</li> <li>Testing22</li> </ul> </div> Both the files are in the same level and in both files I have included the JQuery related stuffs inside one folder called JS like <script type="text/javascript" src="JS/jquery-1.3.2.js"></script>
colorpicker demo won't work locally if downloaded
I downloaded the "colorpicker" demo from http://jqueryui.com/demos/slider/colorpicker.html so I could experiment with it. At first it showed no bars. I determined that was because the css file imported files local to the jquery site. I located and downloaded ui.theme.css and ui.base.css. Now there were bars, but no slider handle, and no colors to the left of the handle. Can anyone tell me what files I need to run the colorpicker demo locally? And, wouldn't it be a good practice to include all necessary
Cancel Selected An Item of Selectable 选项
I used jQuery ui selectable function on my web page. So long it works fine, but I find a problem that if we’ve already selected some items, and I want to cancel selected one item of them, how could we do? I try to bind a click function to the elements to remove the style of ui- selected, but it doesn’t work at all. It’s so strange. Guys, could you help me in some way? I just want to ask whether the jQuery ui selectable provides a way to unselected one item by doing ctrl+click. Here is the sample:
Hide or close dialog on click outside the dialog
Hi, I have a dialog that serves as a data picker. Problem is that I'd like it to behave like the datepicker does. When you click outside of the datepicker, it closes the datepicker. How can I make a standard dialog work the same way? /Göran -- This message has been scanned for viruses and dangerous content by MailScanner, and is believed to be clean. --
Slider problems
Hi, I've searched all over for an answer to this so forgive me if I just missed it somewhere. I'm recreating the slider at the top of this page: http://www.screeninnovations.com/projector-screens/ using the 1.7.2 UI release. Since it was originally done using an earlier UI version I can't seem to recreate it in 1.7.2 closely enough. Specifically I'm having trouble getting the ul.products list to animate when clicking on the scroll bar outside of the handle and not animating, but rather sliding smoothly
Help! Please. Using Tabs to link to an external page using #, stop page scrolling.
Hello, I am wondering if someone could point me in the proper direction regarding external links and tabs. At the moment I have a home page that links to a new page that contains tabs. On the home page I have used # to link to its respective tab in the external page. My problem is that when the tabbed page opens (with the respected tab open), it automatically scrolls down. Given the situation, I don't want this auto scroll to happen due to the #. I am trying to stop the page from scrolling when loading
Suggestion for a nice grid?
Hello all, I am prototyping a project and need a cool grid to play with and use. Can anybody suggest something good and with clear documentation? Needless to say, it shall be fully supporting AJAX (remote crud). Ideally, the grid I am looking for has the following features: - Integrated with latest JQuey UI (theme support) - Draggable columns - Filters - Double sorting (local and remote, I want to be able to ) - Footers - Display/Hide grid columns(f.i. I want to keep the ID column but unwilling to
[button] How to set an image via classname
Hi* I'm trying to specify an icon outside the CSS framework. with the markup <a class="ui-button ui-button-costom.png" title="Aggiorna la quotazione della pratica." href="#" > Aggiorna quotazione </a> I can not see the image "custom.png" Can someone give me an example? The image is not part of a CSS sprite but a single PNG. How can I possibly specify a path with. and .. ? Tkz a lot! --
Drag-and-drop under HtmlUnit
Hello Has anyone tried to do jQuery UI drag-and-drop running in HtmlUnit? My initial attempt didn't work so I just wanted to see what other people's experience was before spending a lot of time debugging. Thanks Ben --
Slider
Can I use the slider to control volume of an embedded video (but not flash based)? Is there any tutorial in doing this? Thanks a million.. --
Next Page