r105866 MediaWiki - Code Review archive

Repository:MediaWiki
Revision:r105865‎ | r105866 | r105867 >
Date:11:38, 12 December 2011
Author:santhosh
Status:resolved (Comments)
Tags:
Comment:
Change the behavior of menu, show it on click, instead of hover.
Modified paths:
  • /trunk/extensions/WebFonts/resources/ext.webfonts.css (modified) (history)
  • /trunk/extensions/WebFonts/resources/ext.webfonts.js (modified) (history)
  • /trunk/extensions/WebFonts/resources/images/arrow_down.png (added) (history)

Diff [purge]

Index: trunk/extensions/WebFonts/resources/ext.webfonts.js
@@ -334,15 +334,19 @@
335335 var fn = $( 'body' ).hasClass( 'rtl' ) ? 'append' : 'prepend';
336336 $( '#p-personal ul:first' )[fn]( $li );
337337 $( 'body' ).prepend( $menu );
338 - $menu.hide();
339 - $li.hover( function() {
 338+ $li.click( function( event ) {
340339 $menuItemsDiv.css( 'left', $li.offset().left );
341 - $menu.show();
 340+ if($menu.hasClass( 'open' ) ){
 341+ $menu.removeClass( 'open' );
 342+ } else{
 343+ $( 'div.open' ).removeClass( 'open' );
 344+ $menu.addClass( 'open' );
 345+ event.stopPropagation();
 346+ }
 347+ } );
 348+ $( 'html' ).click( function() {
 349+ $menu.removeClass( 'open' );
342350 });
343 - $menu.hover( function() {
344 - }, function() {
345 - $menu.hide();
346 - });
347351 // Workaround for IE bug - ActiveX components like input fields coming on top of everything.
348352 // @todo Is there a better solution other than hiding it on hover?
349353 if ( $.browser.msie ) {
Index: trunk/extensions/WebFonts/resources/images/arrow_down.png
Cannot display: file marked as a binary type.
svn:mime-type = image/png
Property changes on: trunk/extensions/WebFonts/resources/images/arrow_down.png
___________________________________________________________________
Added: svn:mime-type
350354 + image/png
Index: trunk/extensions/WebFonts/resources/ext.webfonts.css
@@ -4,11 +4,22 @@
55 padding-left: 15px !important;
66 }
77
 8+li#pt-webfont a{
 9+ /* @embed */
 10+ background: url(images/arrow_down.png) no-repeat scroll right top transparent;
 11+ padding-left: 5px;
 12+ padding-right: 15px;
 13+}
 14+
815 div#webfonts-menu {
916 font-size: 100%;
1017 z-index: 99999;
 18+ display: none;
1119 }
1220
 21+div#webfonts-menu.open{
 22+ display: block;
 23+}
1324 div#webfonts-fonts {
1425 font-size: 100%;
1526 z-index: 99999;
@@ -114,3 +125,4 @@
115126 div.webfontMenu label:hover, input:hover {
116127 cursor: pointer;
117128 }
 129+

Follow-up revisions

RevisionCommit summaryAuthorDate
r105867Remove the arrow from the menu as per feedback. Follow up r105866santhosh12:02, 12 December 2011

Comments

#Comment by Nikerabbit (talk | contribs)   14:35, 12 December 2011

Code ok except missing whitespace at places.

Functional comment: if you click on the menu itself it also disappears - this makes missclicks hard to notice.

Status & tagging log