Copying UI style
Hi, I'´m using the Humanity theme for my webpage with several widgets (tabs, dialog and datepicker) and would like to extend the theme to the rest of the webpage. Specifically, I would like to make a regular div on my page and have it styled with the same theme (ideally I want it to look exactly like a dialog, but without the functionality). Is this possible? I've looked at the theme's css but it seems like a lot of the styling is done in javascript. Any ideas how I could do this? Thanks
UI Dialog AppendTo(Body)
Anybody know why the dialog code is Appended to the Document.Body by default? This causes problems when using form fields within the dialog because it physically moves the fields outside the scope any forms. Just curious why this is default behavior. And if it is because of compatibilty issues, why aren't they addressed in the code instead of making a drastic code move? I modified my dialog.js, but don't know what the consequences will be for other browsers. Thanks, Mike
UI Dialog .AppendTo(Body)
Anybody know why the dialog widget automatically moves the dialog sections to the document body by default? That "feature" messes up form fields functionality, because it completely removes the fields from the scope of their form. Thanks, Mike.
jquery UI allows to drag links
I have a problem with jquery UI. I want to be able to drag/sort list elements ONLY when enabled explicitly by say $('#menu').sortable(); Yet if I just load jquery-ui.js and there is a link <li><a href="">sth</a></li> I can drag it without enabling anything! It seems to be a bug or am I doing something wrong? I am using firefox 3 on ubuntu 9.04. Here is an example file with this problem: <html> <head> <script src="jquery-1.3.2.min.js" type="text/JavaScript"></script> <script src="jquery-ui-1.7.2.custom.min.js"
Accordion Docs
Base on the docs at <a href="http://jqueryui.com/demos/accordion/">http://jqueryui.com/demos/accordion/</a><div> </div><div>why does the following not work? <div> </div><div><a href="http://jsbin.com/ocava">http://jsbin.com/ocava</a></div> <div> </div><div>I am also seeing conflicting code on the examples page. Where the header parameter is not given yet the following works..</div><div> </div><div><div><div id="accordion"></div><div> <span class="Apple-tab-span" style="white-space:pre"> </span><h3><a
Problem with tabs. Load content into own div
Hi. Just starting to use the Tabs function, and think it's great. One problem though, my links and content got to be in the same div. Like this : $(function() { $("#navi").tabs({ fxFade: true, fxSpeed: 'fast' }); }); <div id="navi"> <ul> <li><a href="#nyheter">Nyheter</a></li> <li><a href="#arbeid">Arbeid</a></li> </ul> <div id="nyheter"> Nyheter her </div> <div id="arbeid"> Arbeid her </div> </div> How can I change this so I can load the content in a second div instead of being in
links with href attribute are dragged by the mouse by default
[Sorry if duplicate but my original post did not appear on the group for more than a day..] I have a problem with jquery UI. I want to be able to drag/sort list elements ONLY when enabled explicitly by say $('#menu').sortable(); Yet if I just load jquery-ui.js and there is a link <li><a href="">sth</a></li> I can drag it without enabling anything! It seems to be a bug or am I doing something wrong? I am using firefox 3 on ubuntu 9.04. Here is an example file with this problem: <html> <head> <script
Problem with tabs. Load content into own div
As the demo and example show, the links and content is in the same div. As you can see here: <script type="text/javascript"> $(function() { $("#navi").tabs({ fxFade: true, fxSpeed: 'fast' }); }); </script> <div id="navi"> <ul> <li><a href="#nyheter">Nyheter</a></li> <li><a href="#arbeid">Arbeid</a></li> </ul> <div id="nyheter"> Nyheter her </div> <div id="arbeid"> Arbeid her </div> </div> How can I make it to load the content inside a new div outside, in this example, the #navi that
sortable() with weird DOM
Here's an example markup, which looks like a regular table if you add in some css: <div class="headers"> <div class="headeritem">id</div> <div class="headeritem">name</div> <div class="headeritem">address</div> <div class="headeritem">phone</div> </div> <div class="scroller"> <!--this just acts as an overflow:hidden container its child--> <div class="grid"> <div class="row" style="top:0px"> <div class="col c0">1</div> <div class="col c1">John Smith</div>
jquery ui portlet
jQuery ui portlet I have a problem with jQuery ui portlet. We say that everything works and can save in the mysql db position of div, but I do not know how to load their position to the loading of the page, and then at every refresh the portlet back into their natural position which is the html code. Suggestions? Meanwhile, place some code [CODE] $("#contenitore-centrale .column").sortable({ connectWith: [ '#contenitore-centrale .column' ], handle: '.portlet-header', opacity: 0.6, items: '> .portlet',
opening links on same tab
i am trying to create a page with divs. one div contains my tabs. what i want is without leaving the page, opening links on same tabs, I have tried the ...open links in the current tab instead of leaving the page "Hijax" links after tab content has been loaded: $('#example').tabs({ load: function(event, ui) { $('a', ui.panel).click(function() { $(ui.panel).load(this.href); return false; }); } }); method but it worked only ones, after one click this doesn't work anymore. please help, thanks
jquery tabs with cookie send fragment to url onload
Hi there, hope someone can give me some help with that prob. How can I add a fragment to url, if the tabset is loading (..onload)? How to manage an onload function? How can I get the the id of a clicked tab? I have this code <code> // Process custom tabs. $('.drupal-tabs:not(.tabs-processed)', context) .addClass('tabs-processed') .each(function () { if ($(this).is('.tabs-navigation')) { Drupal.tabsNavigation(this); } }) .find('> ul') .tabs({ cookie: { expires: 0}, selectedClass: 'active', fx: fx,
My JQuery DatePicker onClose does not fire my jquery ver 1.3.2 and all lib that bundle with it.
Here is my code snippet $("#txt").datepicker({onSelect: function() {$("txt").datepicker ('destroy');}}); $("#txt").datepicker({onClose: function() {$("txt").datepicker ('destroy');}}); I need to override the onSelect due to the bug in IE with respect to asp.net validation error. I am destroying the datepicker in both events as I do not want the datepicker to display when my cursor moves to the textbox attached to datepicker and I am using an external button as I do not wish to use the ( showon:button
How to avoid display of content while page is loading
I am wondering whether there is a trick to avoid the display of UI themeroller controlled content while the whole page is loading. Thank you for your advice!
Combining jcarousel and drag and drop code
Hi, i am vinod kumar, i am new to jquery. I have implemented jcarousel and drag and drop separately. When i start implemented both, its not working. the code for jcarousel will like this <script type="text/javascript" src="jquery-1.2.3.pack.js"></script> <script type="text/javascript" src="jquery.jcarousel.pack.js"></ script> jQuery(document).ready(function() { jQuery('#mycarousel').jcarousel({ ............. and the code for drag and drop will like this <script src="drag-and-drop/jquery/jquery.js"></script>
Help with draggable and event.target
<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:x="urn:schemas-microsoft-com:office:excel" xmlns:p="urn:schemas-microsoft-com:office:powerpoint" xmlns:a="urn:schemas-microsoft-com:office:access" xmlns:dt="uuid:C2F41010-65B3-11d1-A29F-00AA00C14882" xmlns:s="uuid:BDC6E3F0-6DA3-11d1-A2A3-00AA00C14882" xmlns:rs="urn:schemas-microsoft-com:rowset" xmlns:z="#RowsetSchema" xmlns:b="urn:schemas-microsoft-com:office:publisher"
$get problem with callback into a modal
I am trying to use simplemodal plugin and load a full marked up html file with imbedded script files and css because I want to be able to use that page as a standalone as well as call it from another page and have it pop up in modal dialog box. Here is a stripped down test version, not working as well as the full blown version on my local system, but I wanted someone to get an idea. http://www.i-strive.com/testing/simplemodal.html when I try and run the full page load in FF2 on XP & 3.? on Mac I
datepicker: questions and possible error report on enter key behavior
I'm having problems with enter key behavior in the datepicker. I am running jQuery 1.3.2. I have also seen the below behavior running from the jQuery demo (http://jqueryui.com/demos/datepicker/) directly. All test cases are in Firefox 3.0.11 on an Intel Mac running 10.4.11. Test case: Hand enter a date in the proper format in a text field that has the datepicker bound to it. Then click the Enter key. The datepicker appears to override the existing input and put in today's date. Possible workaround:
Making UI Tabs Ignore UI Theme
I know, sounds like a strange request, but I've completely re-themed UI Tabs through a ui.tabs stylesheet, but whenever I pull ui.theme in to the page for a slider and sortable list, it immediately wipes out the majority of my changes to the tabs. So how do I make UI Tabs ignore the ui.theme classes that the UI library puts on the HTML elements? David
date Picker issue
Hi, I am using the datepicker in jQuery UI and I want to get that value in C# code behind.If I use runat="server" attribute it does not work.Can you help me to get this value in the code behind.Other thing is I want to go for a post back once I change the date.Then I used a asp.net textbox control.But It seems to be not working for it too.Can you help me.I am waiting for a feedback. I found you email from http://jqueryui.com/support page. Thank you, Prasad Maduranga.
Need help with jquery ui selectable lasso
I am working on jquery ui selectable.I am new to this ,dont find any good examples or documentation online. I want to disable the lasso..(ability to draw a box with your cursor to select items.) can anyone please help me with this
Question: Form focus to prevent fadeOut?
I'm having a little trouble coming up with a concise way to do this. I've created a div containing a registration form that fades in when the user hovers over a triggering link, and the code I'm currently using is as follows: $(document).ready(function() { var hide = false; $(".reg1, .register").hover(function(){ if (hide) clearTimeout(hide); $(".login, .about").fadeOut(40); $(".register").fadeIn(); }, function() { hide = setTimeout(function() {$(".register").fadeOut();},
selector: option for not deselecting existing selections upon click?
essentially, i'd like the selections to be sticky - as in, click to select, click again to deselect. if i click one box, then click another, both are selected. is there already support for that? thanks in advance!
Can I change the destination of the 'revert' animation in a sortable?
I've put together a minimal example of what I'm trying to do here: http://sab39.netreach.com/SiteData/sortable/ The idea is that the left hand side of the screen, in red, consists of a list of items that are not currently in use, the right hand side in green consists of a sortable list of items that are in use. The behaviors I'm trying to achieve are: a) The red list is not really supposed to be sortable - the items in it are only for dragging to the right hand list - so any attempt to move an item
draggable & droppable issues
Hi!!! I'm new to Jquery UI, and I'm practicing with this demo http://jqueryui.com/demos/droppable/#photo-manager This is, there is a "gallery", and a "trash", an I can drag an image from the gallery and drop into the trash. Well, my problem is that I want not to delete the image from the gallery, instead I want to stay in both places, and I don't know how to avoid the image being deleted from the gallery when is dropped in the trash. Well, sorry with my english, if anyone can help me, it would be
Modal + iFrame
Hi Guys, I'm working on something and am trying to figure out the best way to achieve my outcome. I'd like to use the jQuery UI Modal Dialoge, and what I'm looking to do doesn't seem to difficult as it is just a button that needs to be pressed. What I have is a table of orders, if you click on the open in new window button for that line it needs to bring the related order up as a form in the modal window. I was thinking to do this with an iframe, but I'm not sure the best way to do it, as the window
Question to droppable and hover
Let there be 2 classes of droppables: One class accepts green draggables, and hoverclass is set that when a green draggable is moved over the droppable, its color changes to green, too. The other class accepts red draggables, and hoverclass is set that when a red draggable is moved over the droppable, its color changes to red, too. So far, this works fine. The problem is when a droppable belongs to both classes, its color should change to red or green depending on the draggable which is currently
jQuery ui portlet position
jQuery ui portlet I have a problem with jQuery ui portlet. We say that everything works and can save in the mysql db position of div, but I do not know how to load their position to the loading of the page, and then at every refresh the portlet back into their natural position which is the html code. Suggestions? Meanwhile, place some code [CODE] $("#contenitore-centrale .column").sortable({ connectWith: [ '#contenitore-centrale .column' ], handle: '.portlet-header', opacity: 0.6, items: '> .portlet',
Dragable (and thus Sortable) does not work with Konqueror
Hi, I'm not sure this is the right list for this, so please redirect me if needed. I'm using Konqueror 3.5.9. on Linux, and dragable/sortable is not working there at all. When you click and try to drag, it selects text instead. This seems a little bit strange to me because other KHTML/ WebKit based browsers (Safari, Chrome) are listed as compatible (I haven't tried though, as none of those is available under Linux). I tried calling disableSelection directly for LI tags, but that did not help. Any
Can i create fast animation of images and replace usual flash tast with jquery?
Well, everytime somebody need to do some animation, even not vector, but based on jpegs and pngs, almost everyone including me have no other optiong than use flash that plays animation sequence. But can that task be done with jquery? i just want to create no only animated menus but a sequence of multilyaered pictures in background to animate it. how can i do if, if i got, for example 10 png files as background 10 png files as foreground both should change each other with constant speed and foreground
Sortables won't sort
I'm trying to sort a group of images with a sortable but they don't seem to want to sort. I've tried wrapping the img tag inside of a div and specifing the div as the item and the img as the helper but that doesn't seem to help. I'm able to drag an image however as i move over the other items they don't move around and when i let go of the dragged item it doesn't drop in just reverts to it's position. here is the code for the div thats to be sorted <div id="menu_dockIcons" style="z-index: 20001;
resetting slider handles on range value change
Hi guys, I have a jqui slider and max and min values of the slider are based upon a set of radio buttons a user chooses. I am able ot chnage the max and min range of the slider but am not able to change/reset the the position of the slider back to min and max if the valus of min and max are chnaged... couldn't find any help directly related to this problem...i need to reset it on the fly and not reload the page... thanks
2 questions about drag and drop
Hello, I have two questions about drag and drop that I have been trying to answer myself. Any insight would be greatly appreciated. First, I want to create an area where text or images can be dropped in. The thing is, they're not jQuery draggables. It's just regular text that someone is highlighting and then dragging in a browser. Will the droppable recognize this even though it's not a jQuery draggable? Second, how can I get the details about the text or image that was dropped in? I want to be able
CSS documentation (especially for slider)
Hi, I integrated jquery UI slider on my site over a year ago and it's been working well. I created a few javascript functions to set up sliders in places where the server rendered input boxes and select boxes. I'm using my own created graphics which includes a fat slider handle. When I tried to upgrade I found that the API had changed dramatically. The slider create function arguments were different, and so were the style names (and number of them). I've gotten to the point where it works, except
Datepicker locale problem
Hallo all. I'm trying to use the datepicker localize option; I copied the example from the tutorial as you can see below: http://pastie.org/540162 Everything works fine in this way. When i try to move the code in the document.ready the locale does not work any more. It seems that it takes always the last locale javascript referenced in the html file. http://pastie.org/540168 So it seems that is not possible to change programmatically the locale. Any idea? Kind regards Massimo
Datepicker and IE6 REALLY slow
I'm experiencing a problem with datepicker and IE6. Basically, it takes 3-5 seconds to render the calendar in IE6. It works fine in Firefox. But I'm in a corporate environment and IE6 is the current enterprise standard. It's not an issue with the computers as they are all new Dell's with dual core processors and 3G or RAM. It's also not a problem isolated to a particular PC - I've tested it on just over a dozen PC's and they all experience the same problem. I see the problem when I browse the official
ui helper offset & droppable area offset
Hello I am having trouble with the draggable and the droppable components of Jquery UI. 1) At start event of the draggable element I dynamically create a droppable area, but as this changes the position of the image it creates an offset between the mouse and the image. How can I make the draggable element always stick to the mouse? I really need to create that element dynamical for the design's sake. 2) The droppable is sometimes right on the div that it's supposed on, but it moves! Sometimes it
Getting the ID of a tab
How can I get the ID of a tab? I have several tabs with on the tabs a field with the same class.How can I target the field that is on the current tab? Right now it always gets the field on the first tab even when I am on the second one etc.. Any ideas?
Internet Explorer not rendering JQuery UI Tabs
Hi all, Thanks so much to anyone who can help me with the following problem. I'm using JQuery tabs on the following page: http://www.georgiasouthern.edu/magazine2/index.php?option=com_content&id=23 The tabs show perfectly in FF and Safari but do not render at all in Internet Explorer. Any clues on how to fix this? Thanks again for your help! Tutwelve
[dialog] - button-label by language-object ?
Hi, i'm building a site with some of your jqueryUI Plugins, like the dialogbox. Now i want to create a confirmationbox, but i want to label the buttons by an language-object. e.g. : buttons: { language['yes'] : function() { $(this).dialog('close'); }, language['no']: function() { $(this).dialog('close'); } } But this way do not work. Any help ?
Next Page