<html><body style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; ">
<div><div>On Nov 4, 2009, at 9:45 AM | Nov 4, 2009, Jörn Zaefferer wrote:</div><br class="Apple-interchange-newline"><blockquote type="cite">While building an example application, I noticed a few issues:
- .slider() can't be used on an input, instead I have to manually create a div, insert that, handle the resulting layout issues...
</blockquote><div>I agree that this would be a nice convenience. Would we just support the slider replacing the input, or fading in and out upon focus? </div><div>Something like this for instance, could replace it:</div><div>
</div><div><i>var myInput = $('#myInput');</i></div><div><i>
</i></div><div><i>$('<div></div>')</i></div><div><span class="Apple-tab-span" style="white-space:pre"><i> </i></span><i>.slider({</i></div><div><span class="Apple-tab-span" style="white-space:pre"><i> </i></span><i>slide: function(ui){</i></div><div><span class="Apple-tab-span" style="white-space:pre"><i> </i></span><i>myInput.val(ui.value);</i></div><div><span class="Apple-tab-span" style="white-space:pre"><i> </i></span><i>}</i></div><div><span class="Apple-tab-span" style="white-space:pre"><i> </i></span><i>})</i></div><div><span class="Apple-tab-span" style="white-space:pre"><i> </i></span><i>.insertAfter(myInput)</i></div><div><span class="Apple-tab-span" style="white-space:pre"><i> </i></span><i>.prev()</i></div><div><span class="Apple-tab-span" style="white-space:pre"><i> </i></span><i>.hide();</i></div><div>
</div><div>It'd be nice for this to happen when you call myInput.slider(), but maybe just documenting this code is enough...?</div><div>
</div><div>We've been talking for a while about being able to call .slider() on a select as well, and there's an example plugin in the lab that does it already.</div>
<blockquote type="cite">- there is no demo that shows how to use draggable and droppable to add items to a container; there is the simple photo manager demo, but thats way too complex
-> my attempt at inserting the ui.helper at the droppable had two results: either nothing happened (helper was killed), or I cloned it first, but then ended up with position:absolute and the position styles
- the theme font-sizes are irritating: as soon as I apply a tabs widget, the font-size of the tabs content changes, I dunno why and I don't know how to set it up so that I can toggle tabs without affecting contents font-sizes
</blockquote><div>This one can be tough because we always put the ui-widget class on the outermost container, and that controls font size inheritance for all its children. </div><div>
</div><div>I'd recommend you write a single override style that sets the ui-tabs-panel class back to whatever font-size you need to make 1em = 10px (or whatever your content assumes 1em is equal to). </div><div>
</div><div>So if you set your global font-size in themeroller to 1.2em, you could add this rule to reset the content panel:</div><div><i>.ui-tabs-panel { font-size: .83em; }</i></div><div>
</div>Does that make sense?</div><div>
<blockquote type="cite"> - themeroller bookmarklet works well, but takes a long time to load and doesn't seem to cache anything, when loading it again, the load time is just as bad</blockquote><blockquote type="cite">
On the other hand:
- tabs work well as is, and the markup is easy enough to write down without having to lookup the docs or copy an example</blockquote><blockquote type="cite">
Any thoughts on these? I can put comments on the appropiate wiki pages later on.
Jörn
</blockquote></div>