I am using the YUI JavaScript / CSS compressor from yahoo to compress our JS & CSS.
While using it I encountered a rather strange problem, the compressed CSS was working fine in Firefox but not in IE. Upon investigating it came down to a peculiar problem.
One of our CSS has a CSS rule like.,
{ height: expression( this.scrollHeight > 96? "96px" : "auto" );}
After running thru the YUI compressor it becomes.,
{height:expression(this.scrollHeight>96? "96px":"auto");}
The above CSS works fine in FF but not in IE (tested in IE8 & IE7)
when I change the above CSS as given below it works fine. Notice the space before and after the > symbol
{height:expression(this.scrollHeight > 96? "96px":"auto");}
For some strange reason after giving those spaces every thing was fine with IE.,
Any Idea whats going on here ? Bug in IE, YUI or the CSS ?
anyway, I just ran a `sed` replace command on the CSS folder to fix it now. Any other elegant fix are welcome.
find . -name "*.css" -print | xargs sed -i 's/>/ > /g'
Change Log
- Fixed: Handling multiple spaces in keywords.
- Fixed: On empty results drop down border visible.
- Added: Keyword highlighting can now be either as string/words
Highlight Mode
The hlMode Option defaults to “string” mode, other supported format is “word”
On the drop down when keyword high lighting is on, till now the highlighting was done only as a string, Now it can be done as both string or word, like.,
when search is as “apple fruit” and the search result is “apple is a fruit” if the hlMode is set to word then both apple and fruit in the drop down will be highlighted.
highlight: true,
hlMode: "string"
Download :
jquery.jSuggest.1.1
jSuggest Enhanced updated to 1.1
I was looking for a lightweight simple auto-complete using jQuery, found a perfect one that fits my requirement, enter jSuggest an excellent lightweight auto-complete control based on the beautiful jQuery.
However I needed some extra’s like,
- Trigger callback function on a ‘Click’ / Selection from the drop down.
- Highlight the search keywords in the drop down list.
- Support for JSON data
and do I hooked up these minor enhancements to the core.
You can download the patched version from the link at the bottom of this post.
Data Format
The dataFormat Option defaults to “json” format, other supported format is “html”
dataFormat: "json"
Highlight Keywords
The highlight Option defaults to “true” for highlighting search keywords on the dropdown.
highlight: true
The actual display differentiation has to be done on the CSS level for the high light to show.
#jSuggestContainer ul li var{background:#FFCC65; font-weight:bold;}
On Select Callback
The onSelect Option defaults to “” (empty), When a callback function name is given, the given function is called with the selected text.
onSelect: "callback_function_name"
Hope this helps some one.
Original Contol at : Keansphere (jSuggest)
Patched file : Enhanced jSuggest
