mirror/openseadragon
1
0
Fork 0
mirror of https://github.com/openseadragon/openseadragon.git synced 2025-01-31 23:21:42 +03:00
Code Issues Projects Releases Wiki Activity

Better Button Fix

Browse Source 
Wrapped the images in a single div and used that as the content of a
button element.
This commit is contained in:
Mark Salsbery 2013-12-06 16:24:52 -08:00
parent e070475172
commit d3bcd0cec8
1 changed files with 12 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/button.js
View File

@ -120,7 +120,7 @@ $.Button = function( options ) {
* @member {Element} element
* @memberof OpenSeadragon.Button#
*/
this.element = options.element || $.makeNeutralElement( "div" );
this.element = options.element || $.makeNeutralElement( "button" );
//if the user has specified the element to bind the control to explicitly
//then do not add the default control images
@ -129,22 +129,23 @@ $.Button = function( options ) {
this.imgGroup = $.makeTransparentImage( this.srcGroup );
this.imgHover = $.makeTransparentImage( this.srcHover );
this.imgDown = $.makeTransparentImage( this.srcDown );
this.imgDiv = $.makeNeutralElement( "div" );
this.element.appendChild( this.imgRest );
this.element.appendChild( this.imgGroup );
this.element.appendChild( this.imgHover );
this.element.appendChild( this.imgDown );
this.imgDiv.style.position = "relative";
//this.imgRest.style.position =
this.imgGroup.style.position =
this.imgHover.style.position =
this.imgDown.style.position =
"absolute";
this.imgRest.style.top =
this.imgGroup.style.top =
this.imgHover.style.top =
this.imgDown.style.top =
"0px";
this.imgRest.style.left =
this.imgGroup.style.left =
this.imgHover.style.left =
this.imgDown.style.left =
@ -160,6 +161,12 @@ $.Button = function( options ) {
this.imgDown.style.top =
"";
}
this.imgDiv.appendChild( this.imgRest );
this.imgDiv.appendChild( this.imgGroup );
this.imgDiv.appendChild( this.imgHover );
this.imgDiv.appendChild( this.imgDown );
this.element.appendChild( this.imgDiv );
}
@ -183,10 +190,8 @@ $.Button = function( options ) {
// Whether this button should fade after user stops interacting with the viewport.
this.shouldFade = false;
this.element.style.cursor = "pointer";
this.element.style.display = "inline-block";
this.element.style.position = "relative";
this.element.tabIndex = "0";
this.element.title = this.tooltip;
/**