Try to fix arrow bug with firefox
parent
4b4d700f5e
commit
b8e5a9a79f
|
@ -3,20 +3,20 @@
|
|||
* Copyright (c) 2014 Daniele Lenares (https://github.com/Ryuk87)
|
||||
* Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php)
|
||||
* and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses.
|
||||
*
|
||||
*
|
||||
* Version 1.0.0
|
||||
*
|
||||
*/
|
||||
(function ( $ ) {
|
||||
|
||||
|
||||
$.goup = function(user_params) {
|
||||
|
||||
|
||||
/* Default Params */
|
||||
var params = $.extend({
|
||||
location : 'right',
|
||||
locationOffset : 20,
|
||||
bottomOffset : 10,
|
||||
containerSize : 40,
|
||||
containerSize : 44,
|
||||
containerRadius : 10,
|
||||
containerClass : 'goup-container',
|
||||
arrowClass : 'goup-arrow',
|
||||
|
@ -32,26 +32,26 @@
|
|||
titleAsTextClass : 'goup-text'
|
||||
}, user_params);
|
||||
/* */
|
||||
|
||||
|
||||
|
||||
|
||||
$('body').append('<div style="display:none" class="'+params.containerClass+'"></div>');
|
||||
var container = $('.'+params.containerClass);
|
||||
$(container).html('<div class="'+params.arrowClass+'"></div>');
|
||||
var arrow = $('.'+params.arrowClass);
|
||||
|
||||
|
||||
/* Parameters check */
|
||||
if (params.location != 'right' && params.location != 'left') {
|
||||
params.location = 'right';
|
||||
}
|
||||
|
||||
|
||||
if (params.locationOffset < 0) {
|
||||
params.locationOffset = 0;
|
||||
}
|
||||
|
||||
|
||||
if (params.bottomOffset < 0) {
|
||||
params.bottomOffset = 0;
|
||||
}
|
||||
|
||||
|
||||
if (params.containerSize < 20) {
|
||||
params.containerSize = 20;
|
||||
}
|
||||
|
@ -59,15 +59,15 @@
|
|||
if (params.containerRadius < 0) {
|
||||
params.containerRadius = 0;
|
||||
}
|
||||
|
||||
|
||||
if (params.trigger < 0) {
|
||||
params.trigger = 0;
|
||||
}
|
||||
|
||||
|
||||
if (params.hideUnderWidth < 0) {
|
||||
params.hideUnderWidth = 0;
|
||||
}
|
||||
|
||||
|
||||
var checkColor = /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i;
|
||||
if (!checkColor.test(params.containerColor)) {
|
||||
params.containerColor = '#000';
|
||||
|
@ -75,12 +75,12 @@
|
|||
if (!checkColor.test(params.arrowColor)) {
|
||||
params.arrowColor = '#fff';
|
||||
}
|
||||
|
||||
|
||||
if (params.title === '') {
|
||||
params.titleAsText = false;
|
||||
}
|
||||
/* */
|
||||
|
||||
|
||||
/* Container Style */
|
||||
var containerStyle = {};
|
||||
containerStyle = {
|
||||
|
@ -93,7 +93,7 @@
|
|||
containerStyle['bottom'] = params.bottomOffset;
|
||||
containerStyle[params.location] = params.locationOffset;
|
||||
containerStyle['border-radius'] = params.containerRadius;
|
||||
|
||||
|
||||
$(container).css(containerStyle);
|
||||
if (!params.titleAsText) {
|
||||
$(container).attr('title', params.title);
|
||||
|
@ -109,9 +109,9 @@
|
|||
var containerNewBottom = $(textContainer).height() + 10;
|
||||
$(container).css('bottom', '+='+containerNewBottom+'px');
|
||||
}
|
||||
|
||||
|
||||
/* Arrow Style */
|
||||
|
||||
|
||||
/* Arrow Style */
|
||||
var arrowStyle = {};
|
||||
var borderSize = 0.25 * params.containerSize;
|
||||
arrowStyle = {
|
||||
|
@ -121,13 +121,13 @@
|
|||
'padding-top' : Math.ceil(0.325 * params.containerSize),
|
||||
'border-style' : 'solid',
|
||||
'border-width' : '0 '+borderSize+'px '+borderSize+'px '+borderSize+'px',
|
||||
'border-color' : 'transparent transparent '+params.arrowColor+' transparent'
|
||||
'border-color' : 'transparent transparent '+params.arrowColor+' transparent'
|
||||
};
|
||||
$(arrow).css(arrowStyle);
|
||||
/* */
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* params.trigger Hide under a certain width */
|
||||
var isHidden = false;
|
||||
$(window).resize(function(){
|
||||
|
@ -148,8 +148,8 @@
|
|||
if (textContainer)
|
||||
$(textContainer).hide();
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/* params.trigger show event */
|
||||
if (!params.alwaysVisible) {
|
||||
$(window).scroll(function(){
|
||||
|
@ -158,7 +158,7 @@
|
|||
if (textContainer)
|
||||
do_animation($(textContainer), 'show', params.entryAnimation);
|
||||
}
|
||||
|
||||
|
||||
if ($(window).scrollTop() < params.trigger && !isHidden) {
|
||||
do_animation($(container), 'hide', params.entryAnimation);
|
||||
if (textContainer)
|
||||
|
@ -176,7 +176,7 @@
|
|||
if (textContainer)
|
||||
do_animation($(textContainer), 'show', params.entryAnimation);
|
||||
}
|
||||
|
||||
|
||||
/* Click event */
|
||||
var notClicked = true;
|
||||
$(container).add(textContainer).on('click', function(){
|
||||
|
@ -186,11 +186,11 @@
|
|||
}
|
||||
return false;
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
/* Private function for the animation */
|
||||
function do_animation(obj, type, animation) {
|
||||
if (type == 'show') {
|
||||
|
@ -198,11 +198,11 @@
|
|||
case 'fade':
|
||||
obj.fadeIn();
|
||||
break;
|
||||
|
||||
|
||||
case 'slide':
|
||||
obj.slideDown();
|
||||
break;
|
||||
|
||||
|
||||
default:
|
||||
obj.fadeIn();
|
||||
}
|
||||
|
@ -211,15 +211,15 @@
|
|||
case 'fade':
|
||||
obj.fadeOut();
|
||||
break;
|
||||
|
||||
|
||||
case 'slide':
|
||||
obj.slideUp();
|
||||
break;
|
||||
|
||||
|
||||
default:
|
||||
obj.fadeOut();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}( jQuery ));
|
||||
|
||||
}( jQuery ));
|
||||
|
|
Loading…
Reference in New Issue