accordion display
the accordion on the jquery.ui site looks glitch / jerky i.e. not smooth on both ie7 and firefox3 whereas the original on which it was based is perfectly smooth? is this only me?
style problems in IE7
Hi, there are style problems with resize component in IE7.I found the problem in the functional resize demo,sorry for my poor english,i don't how to descript that.Some one can test it if have IE7 setup.
subscribed
<div dir="ltr"></div>
addClass() throws an JS error
Hello, The addClass ui method is thowing a JS error when animating a class with border-width:1px; Is this a known bug?
How to get a object offset in MouseUp Event?
var _MapMouseX=0,_MapMouseY=0; $(document).ready(function(){ $("#divDrag").mousedown(function(){ var offset = $("#divDrag").offset(); _MapMouseX = offset.left; _MapMouseY = offset.top; }); $("#divDrag").mouseup(function(){ var offset = $("#divDrag").offset(); var _MapMouseXnew = offset.left; var _MapMouseYnew = offset.top; alert( "X:"+_MapMouseX + " => " + _MapMouseXnew+"\r\nY:"+ _MapMouseY + " => "+_MapMouseXnew+"\r\n"); }); $("#divDrag").draggable(); }); on MouseUp Event the offset.left == offset.top?????
Tabs 3 and jQuery UI have me stumped
I apologize if this isn't the right place to post this, or if this is an inanely stupid issue, but I literally cannot get Tabs to work. I have used prior versions of Tabs with no problems... but trying to get Tabs 3 working with jQuery UI is just a non-starter for me. I have downloaded jQuery-1.2.6-min.js, and from the UI site I created a personalized download with the core and tabs components... also minified. I reference these two JS files in my head, insert the script code for instantiating the
Code contribution - Stepper/Spinner
I'm sure this question has been asked a million times. But how can I contribute code to this project? I thought I'd try and be helpful by contributing my numeric stepper/ spinner code to the development process. It's still in infancy and probably not coded to the jQuery UI standards (still learning btw) but has the following features: * min, max, start and step size adjustments * supports decimal values and decimal step sizes * supports currency values * increment/decrement via plus/minus buttons,
TinyMCE inside a Jquery UI tab
Hi! I'm programming a tabbed design and inside some ui tabs I have forms with textareas. TinyMCE is not working with those textareas, it doesn't even show. The Jquery plugins I load are: Tablesorter Flot Form Json JGrowl Outside the ui tabs it is working correctly so I think it is a problem related with the ui tabs. Any help would be very appreciated. Regards.
Serializing connected sortables
When I try to serialize a sortable which is connected to others (using connectWith), I only ever seem to get back results from the original sortable (#list_1 in my example). I'm aware I could loop through each of the lists and perform the serialize function on each one, but this seems like incorrect behaviour. The old Interface library behaved more logically by making every list with the given class (.sort in my example) sortable, and serializing them in the same way. Is there a way I can fix my
sortable('serialize') not changing sort order over 3 div cols
Spent hours looking what's wrong but I can't get it to change the serialize sort order.. http://pastebin.com/m2e30a81c
accessing dialog button after it's open?
Hi, I'd like to disable a button in my dialog after the dialog is opened. IE, if the user does something specific in my dialog, I want to disable the visible Cancel button. I've tried this to get at the Cancel button: var myDialog = $("#dialogArea").dialog( { autoOpen:false, title:"Edit", modal: true, height:400, width:525, overlay: { opacity: 0.5, background: "black" }, buttons: { "Cancel": function() { $(this).dialog("close"); } } // buttons }); // dialog $(myDialog).dialog("open"); ... user does
fix for autoResize in dialog with button pane
Hello, I've got a dialog working, and I notice now that autoResize seems to be working to make the div that is contained by my dialog fit to the inside of the dialog properly...very nice. However, the problem I've got now is that it doesn't account for the height of the button pane if it is visible, so if I'm using the button pane, I have to disable autoResize, and implement the same workaround I've been using with the resize event... So...here's my fix for the size method, which includes the button
Tabs + PopupWindow
I am trying to switch from a bunch of generic Javascripts to all of them being jQuery Plugins. I am using PopUpWindow (http://rip747.wordpress.com) to create old- school popup windows on the fly. I am also implementing jQuery UI Tabs but only the ajax implementation of it. Both work fine separately but when I try and put a popup inside of an ajax tab, the popup does not popup and takes control of the current window. I have tried everything I know to do from embedding the popup javascript within the
Tab (ThemeRoller) - Quick Fix to IE 7.0 layout issue
Hi, Just to let you know that if you have a layout issue in IE (7.0 PC for me) with Tab using ThemeRoller (http://ui.jquery.com/themeroller/), you can quickly fixed it addind a space ( ) between the header and the content. The layout issue is actually a blank row that only appear in IE between the tabs (header) and the content. Here is a sample: <div id="myTab"> <ul> <li class="ui-tabs-nav-item"><a href="#tab1">Tab 1</a></li> <li class="ui-tabs-nav-item"><a href="#tab2">Tab 2</a></li> <li class="ui-tabs-nav-item"><a
Effects for Tabs
<div dir="ltr">Hi, I was wondering if anyone knew of a way to use the effects (specifically explode) as a transition between tabs. I haven't been able to find anything in the docs or through google. Thanks, Aaron </div>
setting dynamic height from ajax content
I got the latest versions from SVN today. My previous method of determining the height of the data returned isn't working now, but I'm not sure I ever did it the best way before. I need to get the title from the server and the data, so I have this (though I don't think it's the most efficient): $('#example6').dialog({autoOpen: false, width: 400, autoResize:true, modal: true, overlay: { opacity: 0.5, background: 'black' }}); function openADialog(image){ $('#example6').load('playbook.lasso', function(){
draggables not respecting container when containment set
I'm having a very odd problem when I set the containment option for a draggable element. $('.ifc_graph_container').draggable( { handle: '.ifc_graph_header', containment: '.graphs_tile' }); When I drag the element, it gets a wildly off inline css top attribute set, for example. "top:-1770." If I comment out containment, all works fine (inline top isn't set), but I lose the containment feature. This wasn't an issue with 1.5b2 but has been with subsequent releases. Has anyone else seen
IE6 Formatting Issues w/ Datepicker
I am just starting out using jQuery and have implemented the jQuery UI features. I want to first say that I love them. They are very easy to use and understand for us beginners. The issue though that I'm running into is with IE6. Our company still uses IE6 due to compatibility issues with some of the programs we use as well as not updating our Intranet page to support IE7. When using the datepicker I found the "embed" image to the input box a very cool feature that will allow me to put the button
tabs add: not binding?
Hello I have some tabs, set up with a custom close-button... // Establish tabs... var $tabs = $('#right-body > ul').tabs({ add: function(ui) { var li = $(ui.tab).parents('li:eq(0)')[0]; $('<div class="close-tab"></ div>').appendTo(li) .bind('click', function() { console.log( $('li', $tabs).index(li) ); $tabs.tabs('remove', $('li', $tabs).index(li)); }); } }); This works just fine if the trigger is local and not dynamic. Clicking the tab loads a dynamic page containing a button that opens the panel
Tabs / Auto Max Height
I've been working with ui.tabs.js which is very well designed and easy to use. :) The widget I'm building consists of 3 tabs of variable & random heights. All three tabs need to display their entire content (no scrolling) and be the same height as the tallest tab. I've seen mention that this is doable but haven't been able to find an example. I've written a simple hackaround which loops over each tab doing a max() compare vs the previous tab but would like to either use an existing ui.tabs.js mechanism
How to get the text of selected tab?
Hi, Is there a way to get the text of a selected tab? and can i get that from select event? for example $('#example').tabs({ select: function(ui) { // return the text of the tab you just clicked } }); please help thanks zm
Slider: Display problem with Firefox 3
I found a problem when moving the slider handle to a new value using Firefox 3. Here is the code I am using to initialize my slider: ... if ( $("#TrxOptSlider")) { $("#TrxOptSlider").slider( { steps: 3, min: 0, max: 3, change: function(e, ui) { var lValue = $('#TrxOptSlider').slider('value', 0) + 1; // set the value into the hidden field. $("#TrxOptimizationLevelValue").val( lValue ); } } ); // Set the innitial value if ( $("#TrxOptimizationLevelValue").val() != "" ) { var lValue = $("#TrxOptimizationLevelValue").val();
Sortable table in Opera
Hello The following code creates a sortable table in ff, ie and safari. But it doesnt work in Opera. Does anyone have a workaround or any suggestion to what I can do? JavaScript: $(document).ready(function() { $("#table-1 tbody").sortable({ cursor: "move", items: "tr:not(.last)", start: function(e, ui) { ui.helper.css({opacity: 0.5}) } }); }); HTML: <table id="table-1"> <tbody> <tr><td>a</td><td>Artikkel</td><td><a href="#">Dagens nyhet</a></ td><td>17.05.2008 16:00</td></tr> <tr><td>b</td><td>Artikkel</td><td><a
How to make a draggable that has discrete positions, not continuous positions?
I want to make a draggable on a grid where the draggable block "clicks" to the nearest grid element. Is this feasible? All comments welcome. Matt
ui.item properties
Hello, I am looking hard through the docs to find this info - can anybody please point me to the location of the object reference or similar so I can see the properties of this object? Or even of the ui object? Alternatively, if I'm barking up incorrect vegetation can anybody point me somewhere? Thanks, Andy
Feedback for new plugin idea: ui.querybuilder
Hi all, I've started designing a jQuery UI plugin for building complex search queries in a visual fashion, and wanted to see what people though, or if people had any suggestions. Once the plugin is finished, anyone is welcome to use it of course. I. Overview The goal of the plugin is to create a UI component for piecing together complex multi-component search queries and a simple and visual way. The plugin will allow the user to select some set of desired "search criterion," and then when then submit
Styling selectables
Hi - At the moment I don't think you can style the lasso in a selectable with css, as the helper doesn't have an assigned class like the other components. It would also be useful for the helper to have an id so you could grab the current dimensions of the lasso. I think this can be fixed by changing line 55: this.helper = $(document.createElement('div')).css({border:'1px dotted black'}); to: this.helper = $(document.createElement('div')).css({border:'1px dotted black'}); this.helper.addClass("ui-selectable-helper");
Display other input when option is selected
I have a form with a table that contains a list of names. For each name there are two drop downs - relationship1 and relationship2. When the user selects the option, Other Relative or Other household member, I need a text input to display allowing them to enter the actual relationship. I have something that partially works but I will be using this in several places so I would like to make the code more reusable by allowing parameters to be sent in for the select field name and the input field name.
[accordion] - first click opens, second click follows the link
hello everybody! I am hoping that accordion plugin for jQuery ( http://plugins.jquery.com/project/accordion ) is discussed here. Here's my code for UL menu of Joomla menu, which is contained in a div#sidemenu in my case: <script type="text/javascript" charset="utf-8"> function accordion_create(c) { for (i=1;i<=c;i++) { $j('ul.menu'+i).children('li').addClass('menuitem'+i); $j('li.menuitem'+i).children('ul').addClass('menu'+(i+1)); $j('ul.menu'+i).siblings('a').addClass('head'+i);
animate dialog increase size
Any way of getting the dialog box to ease from original height width to new height width. This code does it without the ease $("#dialog").data('width.dialog', 600).data('height.dialog', 600);
Build your download
Hoi folks! The download builder is missing the option to choose the 'puff' effect to be included in the download package. =o)
jQuery Accordion fillSpace option Firefox 3 isue
Hi, all! This is what i found when i was working on my latest project: when i set the option fillSpace:true, height of the browser window, returned to maxHeight, is not correct, but on the second loop it is. This is what i change and it works fine. before (at line 65): var maxHeight = $(container).parent().height() - toDec; options.headers.each(function() { maxHeight -= $(this).outerHeight(); alert($(container).parent().height()); }); after: var
jQuery Accordion fillSpace option Firefox 3 isue
Hi, all! This is what i found when i was working on my latest project: when i set the option fillSpace:true, height of the browser window, returned to maxHeight, is not correct, but on the second loop it is. This is what i change and it works fine. before (at line 65): var maxHeight = $(container).parent().height() - toDec; options.headers.each(function() { maxHeight -= $(this).outerHeight(); alert($(container).parent().height()); }); after: var
UI Slider with 4 handles
Hi everyone, I have a requirement where I need to have a jQuery UI slider with 4 handles. I've managed to get 4 handles shown by adding more divs with class name 'ui-slider-handle', and positioning them along the div. When I set a min and max value, together with a step interval, the handles step correctly, but I can overlap them, and move them all to the same position. I was hoping they'd behave like the 2 handle version (non-overlapping, and not allowed to be on the same position). Any thoughts
How to have a draggable always on top?
Hi there, I have some draggable windows on my page. Active windows have a z- index of 300, passive ones 250. Now I have another draggable in one of these windows and want to drag&drop it into another one (without a clone). This works fine when I start to drag from a window with z- index 300. But when I start to drag from a passive window, the draggable vanishes behind the active one as it seems to have a lower z- index. How can I fix this? The attribute zIndex doesn't wort, neither with nor without
Sortable, move item with button
Hi all, Sorry if this has been posted before, or maybe it's even considered common knowledge but I couldn't find the answer anywhere. So here goes, I've created a sortable list, and I'd also like some sort of "move up" and "move down" button in each element which will move the element one position up or down. Is this possible with jquery and sortables? And if so, any pointers? Thanks in advance!
Resizable function in ui.dialog
I know there's been a couple of discussions on the resizable functionality within ui.dialog, but here's my two pennies... It would be useful to completely skip the resizable functionality if in the dialog settings, resizable is set to false. The reason being that if I use dialog's inbuilt resizable functionality, it makes altering it using the standard ui.resizable function difficult / unpredictable. For instance, I've tried working around this, like so... $(obj).dialog({resizable:true}); $(obj).parents('.ui-dialog').eq(0).resizable({autohide:true});
Styling selectables with css
Hi - The selectables don't appear to have a class that enables them to be styled with css, nor a convenient ID for getting the size of the selected area. I think this could be fixed by adding this.helper.addClass("ui-selectable-helper"); this.helper.attr( { id:'ui-selectable-helper' } ); at line 51? I checked out the svn but wasn't confident enough to commit this as a change... it's all still a bit voodoo to me... Tom
Function on dialog focus
Can anyone suggest the best way to trigger a function on focus on a dialog?
dialog close callback
Hi, thanks for the help I've received so far. I'm using a dialog, and I'm using a callback function for close in order to manipulate within the dialog. Doing this, however, has cause the dialog to not close. It will close for a fraction of a second, then open again. I've tried returning true, false, and no return within the function, to no avail. I'm using UI 1.5.1 and jQuery 1.2.6. Thanks, Brent
Next Page