Skip to content

{ Category Archives } jQuery

Updating timepickr

Updated code 2/14/2010 I like Maxime Haineault's timepickr. But I found it was written for jQuery 1.2, and didn't trigger events correctly with the current jQuery. It also had more dependencies than I wanted, to the extent that the minified version is 49k large, and had some CSS quirks in Internet Explorer that I couldn't figure [...]
2009 07 09 Danny Comments (24)

Copying jQuery UI styles and Detecting CSS Loading

So let's say I want to create elements that match a jQuery UI theme (in my case, I was using a <canvas> element and wanted to copy colors). I could try to parse the CSS file directly, but that runs afoul of the same-origin security problem (I use Google's CDN to get the jQuery UI [...]
2009 06 24 Danny Javascript Comments (2)

Keyboard accesibility in flexcal

I added keyboard accessibility to flexcal, based on the AOL style guide. Tabbing into the trigger for a textpopup makes it pop. The focus remains on the input element and requires another tab to put the focus on the calendar (a bit awkward to require two tabs but I didn't want to have the input [...]
2009 05 27 Danny Comments (0)

Getting flexcal to Work With the Theme Switcher

Just checking. No reason it shouldn't work with the jQuery UI themeswitcher. The slot machine animation has a white background, which looks off with some themes. The text color for the dates unfortunately is (by the CSS specificity rules) overridden by the blog's text color, so dark themes are near unreadable. $.ui.flexcal.subclass('ui.inlineflexcal', { _init: function() [...]
2009 05 18 Danny Comments (0)

flexcal Slot Machine

Modified 2009-05-19 to use a simpler technique to make it inline. OK, one more flexcal transition, inspired by Stefan Petre's jQuery slot machine. I should have been balancing my checkbook, but my kids thought this was cooler. $('#slots').flexcal({ transition: function(o){ var pane = o.elements.eq(1-o.currSlide), origTable = pane.find('table'); o.elements.eq(o.currSlide).css({zIndex: 1}).animate({top: -o.$cont.height()}, 'normal', 'easeInBack'); pane.css({top: o.$cont.height(), zIndex: 2}).show().animate({top: 0}, 'normal', 'easeInBack', function(){ // [...]
2009 05 07 Danny Comments (0)

flexcal and cycle

The alert reader will notice that the parameters for the transition animation for my flexcal widget are the same as that used by Mike Alsup's cycle plugin. My hope was that I could use { transition: $.fn.cycle.next } and be able to use all those cool effects. It turned out to be not so simple; [...]
2009 05 05 Danny Comments (0)

Improving jQuery UI widget getters/setters

Right now UI widgets need to explicitly declare "getter" functions (methods that return information about the widget rather than manipulate it) with $.ui.widget.getter = 'gettermethod1 gettermethod2'. The reason is that most jQuery plugins are chainable: $(selector).widget('method').css('color','blue') executes method on each element matched, then css('color','blue') on each element. Some plugins and some uses of plugins instead [...]
2009 04 23 Danny Javascript Comments (2)

New jQuery Widget: flexcal

Updated 2009-05-03 Just what the world needs—another date picker Download the code.
2009 04 03 Danny Comments (9)

New Widgets: googleSearch and ajaxpopup

I made a jQuery UI widget (a subclass of textpopup) that hijaxes a Google search form to show the results in a popup box rather than on a new page. Google AJAX search returns only the top four results, so the popup box includes a link to the full search page. Download the code. Download the textpopup [...]
2009 03 25 Danny Comments (0)

jQuery UI 1.7

Finally, jQuery UI 1.6 final is out, renamed 1.7, and it's on google ajax libraries, so it's minimized (45K for the whole thing; .27 sec to download for me, which is nothing, especially if you're loading at the end of your code so the user is busy reading the content of your site). The contributors list [...]
2009 03 08 Danny Web Design Comments (0)