How to make slider handle fit the track
http://jqueryui.com/demos/slider/ jquery default slider's handle is "over" the track, in our experience, the handle box should be "fit" the track, I don't konw why jquery team want's to make it like this, and it's seem's no option to define it, but I really want to know how to do it.
Tabs bug: it switches automatically to tabs 2
Hello, I'm trying to implement JQuery Tabs on my website. All works fine in IE8. The problem is in FF3.6.3: when the page loads, for a second it's displayed the first tab, then automatically switches to the second tab. Could you help me, please? Thank you and bye.
Multiple Progressbars in same page - with different values
This is probably a simple one (hopefully):I'm having several progress bars in a list on the same page. Is there any way to set the value independantly for each one? The optimal way would be either using inner html or possibly an attribute value.. but i'm such a n00b with javascript, i'm not quite sure how. i suppose $(this) comes into play somehow? check sample code here: http://jsbin.com/ovapo3/edit Hopefully i was able to make myself clear.e
Need help with sortable object.
I posted the question in the wrong forum and now need some more help. http://forum.jquery.com/topic/anyone-seen-a-control-like-this I need to know how I can add the arrows.
How to make a table themeroller-compliant?
Hi, I am new in jquery ui and themeroller. I have a table such as the following: <table> <tr> <th>Title</th> <th>Start Date</th> <th>End Date</th> </tr> <tr> <td><span>[title]</span></td> <td><span>[start date]</span> </td> <td><span>[end date]</span></td> </tr> </table> I would like to make
Checking if a slider is going up or down
Hey all, I have three criteria,shown as percentages, that I want to add up to no more than 100%.I am using three sliders to represent the three different criteria,each slider is attached to a textbox which displays the value of the slider. My idea was to make a function that would check the three values of the textboxes and if they were greater than 100 I would return false, otherwise return true. I would use this function during the slider event and return false if the function returned false, thus
UI Accordion behavior question
Hi all, I've got a question about changing the behavior of the UI Accordion widget. I have a request from my users to be able to show more than one accordion "panel" at a time. So the behavior would become open/close a panel when it is clicked, but independent of any other panel already being open, and don't close any other already open panel. How would/should I go about creating this kind of behavior on the accordion widget? Thanks! Doug
UI buttons too fat
Am I the only one that finds the buttons quite "fat"? I haven't found a way to reduce the padding in the design of the buttons via ThemeRoller. When I use a jQuery UI theme to style form buttons like checkboxes, radio buttons and submit buttons, they all look the same. Wouldn't it make UI sense to somehow differentiate between a radio button and a submit button, since they do very different things?
Buttons in IE
Maybe I'm just a moron, but I seem to be having a problem with the buttons. I set up a simple menu bar using, for the most part, the same layout and configuration for the jQuery buttons on the demo. They work just fine with Chrome and Firefox, but for some strange reason they do not work in IE. When I load the page in IE I just see the radio buttons in their natural form, rather than the skins that should appear. I'm still a novice in javascript and css so I wouldn't be surprised if I'm just being
UI History Book icon
I need an icon that looks like a book to use as "history" but I don't see on in the UI icons. Is there a way to create my own icon??
Problem removing tabs
Hi, I'm using jquery ui and it works fine, but I have a problem closing tabs. I create the widget with var tabs = $('#tabs').tabs();And the dynamic ajax tabs: tabs.tabs('add', url, title); tabs.tabs('select', tabs.tabs('length') - 1); Each tab panel has a Close link that fires this: tabs.tabs('remove', tabs.tabs('option', 'selected')); When there are several tabs, and I remove one, the next one is selected itself, nice, but if I try to remove this tab, I have to click the link twice. Seems like it
Create UI Dialog from a node, that may contain <script> tag..?
In my case UI Dialog fails to create a dialog from a node that contains <script> tag. That node may or may not contain <script> tag, it depends on apps logic. Is it meant to work in general? The most illustrative case would be creating a dialog from a third party form, which may contain additional logic passed from remote server through a hybrid local/remote javascript (like Aweber does for example). Is there any easy way to handle this?
Multiple tabs with same names?
Hey guys, I'm having a problem with tabs. I have the following structure: <div id="section-1"> <ul> <li><a href="#tab-1"><span>First Tab</span></a></li> <li><a href="#tab-2"><span>Second tab</span></a></li> <li><a href="#tab-3"><span>Third tab</span></a></li> </ul> <div id="tab-1"> content here </div> <div id="tab-2"> content here </div> <div id="tab-3"> content here </div> </div> <div id="section-2"> <ul> <li><a href="#tab-1"><span>First Tab</span></a></li> <li><a
ui sortable is extremely slow on ie8
ui sortable is extremely slow on ie8. IE 6-7 work much better (tenfold)! And firefox and chrome are okay. To reproduce that, just go to http://jqueryui.com/demos/sortable/ under ie8 and try to move something.
Drop Item from Sortable on to another Sortable Item.
Hi there! I'm developing gallery editing web-application and i have sortable list of Categories on the left side of the page and the sortable "grid" with the pictures on the right. All i want is to allow user to drag the picture item from the grid and drop it over the Category item, so the picture can be moved to this category. It looks like categories list can't be sortable and droppable at the same time. Please advise. p/s: jQuery really rocks!
Select box shows through using IE6
I know there is a bug in IE6 that always places a SELECT contol on top of everything else, even a modal dialog box. Is there an easy workaround for this behaviour in jquery-ui?
Buttonset and original input value
Hi, I've used the buttonset method to initialize several input:checkbox but I've got some troubles with getting the list of actual checked buttons after initialization. The input does not take the values of the label (aria-pressed) but when I submit the form, values are right. Uh ? So if I try : $("input:checkbox[checked='checked']");I've got the original selection of my checkbox. If I try : $("[name^='checkbox_'][aria-pressed='true']");I've got the actual selection of labels pressed and I have to
prevent dd-helper from snap to original
When I use draggable with snap and helper I have the problem that the helper also snaps to its original, thought it isn't visible. Is there an easy way to prevent this behaviour, without changing the class of the original, which hence uses the same selector as used for snapping?
prevent helper from snap to his original
When using draggable, I have the problem that the draghelper snaps to his original, even if that is hidden, because this uses the same selector as used for determine the snap-objects. Is there an easy way to prevent this behaviour without changing the class of the original.
jQuery UI tabs not working in Drupal. Using custom theme made by themeroller.
Hi, I am using jQuery UI 1.7.2 to render tabs on the front page of my Drupal site (link). These tabs were working properly till some time ago till. But now, they are not for some reason. I am using jQuery 1.3.2 (with the help of jQuery update module). I just can't seem to understand why this isn't working. any ideas?
sortable on a table results in broken row width
I'm having a problem with sortable on table rows. when I click my move icon to move the row, the row shrinks in width and stays shrunk when dropped. I've googled for a solution to no avail and I can't find a forum post. It seems like a really old issue tho. One google result I did find talked about the issue but his fix results in a javascript error for me. How the heck do I fix this? (i can't show the problem as its all in a backroom) note, the sortable itself works just fine other than
Jquery dialog close
hello i want to have two close functions in a dialog one that when the user click in the 'X' icon closes the dialog and do some work and when the user click's a button in the dialog it only closes the dialog $("#hiddenPaisExtras").dialog({ modal: true, autoOpen: false, height: 'auto', width: '600px', draggable: true, resizeable: true, closeOnEscape: false, close:
Sortable does not scroll
I have a similar import code: <script type="text/javascript" src="jquery/jquery-1.4.2.min.js"></script> <script type="text/javascript" src="jquery/ui/jquery.ui.core.js"></script> <script type="text/javascript" src="jquery/ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="jquery/ui/jquery.ui.mouse.js"></script> <script type="text/javascript" src="jquery/ui/jquery.ui.draggable.js"></script> <script type="text/javascript" src="jquery/ui/jquery.ui.resizable.js"></script> <script type="text/javascript"
saving ui elements
is it possible to save and restore a draggable rectangle obj ? regards
ASP.NET+JQuery UI Dialog ...
I have a JQuery UI Dialog that inside has a asp:button that must submit to server, but when I add $('#PurchaseDetailInput').click(function () { $('#dialogPurchaseDetailInput').dialog('open'); $('#dialogPurchaseDetailInput').parent().appendTo('form:first'); return false; });Where "parent().appendTo('form:first');", the dialog will cover my web page even if it was hidden and closed! this will also block my other button on my web page screen, but I remove appendTo('form:first');,
When .css("left") is "1000px" if(.css("left")<"195px") is TRUE O.O
css: #wb1{position:absolute; top:125; left:6;} script(in <head>); $(document).ready(function() { $("#wb1,#wb2,#wb3,#wb4,#wb6,#square").draggable({ stop: function() { if($(this).css("left")>="195"); $(this).removeClass("slidebar1b"); if(this==wb1) if($(this).css("left")<"195"){ $(this).addClass("slidebar1b"); $(this).animate({"top":"125","left":"6"}, "slow") }; [...] when I drop "wb1" to a point that absolute coordinate "left" is 1000px or higger, the second if be activated and "wb1"
Two button for two dialog
The function is one button opens dialog A, second button opens dialog B $('#InputGoodsForm').click(function () { $('#dialogInputGoodsForm').dialog('open'); $('#dialogInputGoodsForm').parent().appendTo($("form:first")); return false; }); $('#InputGoodsForm').button(); $('#ChooseQuotation').click(function () { $('#dialogChooseQuotation').dialog('open'); $('#dialogChooseQuotation').parent().appendTo($("form:first")); return false; });
re-trigger the same tab index event
Hi, i am using Jquery UI tabs , to trigger show event i use following statement $tabs.tabs('select',1); after this code executes a tab is set to #tabs-1 but i am failed to re trigger the same event on same tab when #tabs-1 is already shown. so how to re-trigger the same tab event.
CSS selectors prevalence for state backgrounds
Greetings, I'm customizing JQuery UI theme and I ran into a CSS selectors prevalence problem. For state, it's defined like this: .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { background: #d0bf9a url(../images/ui/ui-bg_glass_75_d0bf9a_1x400.png) repeat-x center center; } as you can see, the same class is targeted but using hierarchy with .ui-widget-content and .ui-widget-header. This causes me trouble while customizing buttons background, because
Modal Dialog w/ a checkbox to open another modal dialog
I am having an issue where the checkbox does not stay checked when opening another modal dialog from the checkboxes click event. $('.chkProgressChk').click(function () { if ($(this).attr('checked')) { $(this).attr('checked', true) $('#ConfirmProgressCheck').dialog('open'); $(this).attr('checked', true) } });
DatePicker - Larger than demos.
I've just implemented the DatePicker UI widget on my site. I have it working perfectly, but it looks like: That's the real size - about 35% larger than the ones on the demo site... I know the demo site has font-size 10px, which I tried to do around my controls, but it didn't work. Thoughts?
attr('value', 'Please Wait...') is not working
I have already opened a dialog, there are form inside with InputGoodsAdd, which use to submit the form, but I want to set the button text as "please wait ..." and disable it. $(document).ready(function () { $('#InputGoodsAdd').click(function () { var inputGoodsLink = $('#InputGoodsLink').val(); var inputGoodsQuantity = $('#InputGoodsQuantity').val(); var inputGoodsRequirement = $('#InputGoodsRequirement').val(); var inputGoodsSpecific = $('#InputGoodsSpecific').val();
jQueryUI Tab via AJAX and spinner in body
The spinner option now changes the tab label to "Loading...", can I customize it to change the body instead? Thanks
How to select a slider in order to use keyboard entry
How can I select a slider so I can use the keyboard to control the slider. I have an external event. When that event fires, I would like to have a slider selected so that the user can use the keyboard to adjust the slider. How do I select the slider? Thanks in advance.
ui.sortable to certain position
Hi guys, I've been stumped on this - I have two lists. One is empty (A), the other one isn't (B). I can drag from A to B, but the items goto the top of the list. If I want it in position 3, I have to drag two elements first, then the 3rd. Is there a way to drag it to position 3? To the left of A there is a numbered list, so the exact position is known. And then the regular sorting. What I've done for now is placed 4 empty <li> in A, then when B is dragged over, it can be dropped in the right spot.
How to apply UI framework to HTML element?
Is the aim of Jquery UI framework only for jQuery ui widget?? Or i can push the UI framwork css to html element? (table, button ,div etc) I have a look on this url http://docs.jquery.com/UI/Theming/API#The_jQuery_UI_CSS_Framework but still don't know how it work. For example, i have a grid make in table -> tr- > td But how to apply the correct css class? Alternate, is it any jquery plugin recommend to do so?
box-shadow definition for ui-widget-shadow
Personally, I make this change to my jquery-ui-custom.css because it makes more sense than not doing it: /* Overlays */ .ui-widget-shadow {-moz-box-shadow: 0px 0px 14px #ccc; -webkit-box-shadow: 0px 0px 14px #ccc; box-shadow: 0px 0px 14px #ccc;-moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;}Above is modified from "dark hive" ui theme.
datepicker obscured by flash
I have datepicker that drops down over a flash widget, causing the background of the datepicker to be obscured by the flash. I tried setting the z-order but it is still obscured: #ui-datepicker-div { z-index: 1000; } Any ideas?
How to invoke the browser's F5 behavior using jQuery
I've searched the forum and have not found a solution to this question. Scenario: We have clickable banner tha opens a dialog box and displays a YouTube video. Problem: When a visitor opens the dialog box, starts the video, exits the dialog box and reopens it we get unwanted behavior. One in particular is that the dialog box opens and displays nothing but a white background. Resources: jQuery 1.4.2; jQueryUI.1.8; youtubin.jQuery.1.2; swfobject.js Current Solution: We have included an anonymous
Stop loading via Ajax once loaded
I have jquery tabs that are working perfectly loading data via ajax. what i want is that the first time when the tab is clicked data is loaded via ajax.. the next time it is clicked it does not do the ajax call but show the data that is currently in the respective container of that tab.. can some one help me with this ?
Next Page