jQueryUI tooltip Widget to show tooltip on Click

Using jqueryui: HTML: <div id=”tt” >Test</div> JS: $(‘#tt’).on({ “click”: function() { $(this).tooltip({ items: “#tt”, content: “Displaying on click”}); $(this).tooltip(“open”); }, “mouseout”: function() { $(this).tooltip(“disable”); } }); You can check it using http://jsfiddle.net/adamovic/A44EB/ Thanks Piradian for helping improve the code.

jQueryUI droppable, stop propagation to overlapped sibling

Okay, so I spend an hour trying to figure it out, then as soon as I ask I then find my answer http://jsfiddle.net/rA4CB/7/ Modified the JS to the following: $(function() { $( “#draggable” ).draggable(); $( “#droppable” ).droppable({ tolerance:’pointer’, drop: function( event, ui ) { $( this ) .addClass( “ui-state-highlight” ) .find( “p” ) .html( “Dropped!” … Read more

Using knockout js with jquery ui sliders

Here is an example: http://jsfiddle.net/jearles/Dt7Ka/ I use a custom binding to integrate the jquery-ui slider and use Knockout to capture the inputs and calculate the net amount. — UI <h2>Slider Demo</h2> Savings: <input data-bind=”value: savings, valueUpdate: ‘afterkeydown'” /> <div style=”margin: 10px” data-bind=”slider: savings, sliderOptions: {min: 0, max: 100, range: ‘min’, step: 1}”></div> Spent: <input data-bind=”value: … Read more

Can table rows be made draggable?

This may do the trick. Changes: Wrapped the tr elements inside tbody Added a helper clone when dragging a tr. Only way I could make the dragging actually work. (Tell me if you don’t want this (you want the tr to be removed from the table when you start dragging) and we’ll see if we … Read more