+
+
Put the mouse over the buttons
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/package.json b/package.json
index d6336f3..d3fa2ee 100644
--- a/package.json
+++ b/package.json
@@ -2,7 +2,7 @@
"name": "angular-tooltips",
"version": "0.1.1",
"description": "A tooltips directive for angularjs.",
- "homepage": "none-atm",
+ "homepage": "http://720kb.github.io/angular-tooltips/",
"keywords": [
"date",
"tooltips",
@@ -10,11 +10,10 @@
],
"repository": {
"type": "git",
- "url": "none-atm"
+ "url": "https://github.com/720kb/angular-tooltips.git"
},
"license": "MIT",
"devDependencies": {
- "connect-modrewrite": "*",
"grunt": "*",
"grunt-concurrent": "*",
"grunt-contrib-connect": "*",
diff --git a/src/.DS_Store b/src/.DS_Store
deleted file mode 100644
index 8e7e785..0000000
Binary files a/src/.DS_Store and /dev/null differ
diff --git a/src/css/angular-tooltips.css b/src/css/angular-tooltips.css
deleted file mode 100644
index 379e605..0000000
--- a/src/css/angular-tooltips.css
+++ /dev/null
@@ -1,73 +0,0 @@
-.tooltip {
- background: rgba(0, 0, 0, 0.8);
- color:white;
- position:absolute;
- z-index:9;
- padding:0.4% 1%;
- opacity:0;
- visibility: hidden;
- -webkit-border-radius:3px;
- -moz-border-radius:3px;
- border-radius:3px;
-}
-.tooltip.tooltip-small {
- padding:0.6% 1%;
- font-size: 12px;
-}
-.tooltip.tooltip-medium {
- padding:0.6% 1.2%;
- font-size: 13.5px;
-}
-.tooltip.tooltip-large {
- padding:1% 2%;
- font-size: 14px;
-}
-.tooltip.tooltip-open {
- visibility: initial;
- -webkit-transition: opacity 0.2s linear;
- -moz-transition: opacity 0.2s linear;
- -o-transition: opacity 0.2s linear;
- transition: opacity 0.2s linear;
- opacity: 1;
-}
-.tooltip-caret:after {
- content:'';
- position: absolute;
- width: 0;
- height: 0;
-}
-.tooltip-left .tooltip-caret:after {
- top: 50%;
- left: 100%;
- margin-left:0;
- margin-top: -6px;
- border-left: 6px solid rgba(0, 0, 0, 0.8);
- border-top: 6px solid transparent;
- border-bottom: 6px solid transparent;
-}
-.tooltip-right .tooltip-caret:after {
- top: 50%;
- left:0;
- margin-left:-6px;
- margin-top: -6px;
- border-right: 6px solid rgba(0, 0, 0, 0.8);
- border-top: 6px solid transparent;
- border-bottom: 6px solid transparent;
-}
-.tooltip-top .tooltip-caret:after {
- top: 100%;
- left: 50%;
- margin-left: -6px;
- margin-bottom:-6px;
- border-top: 6px solid rgba(0, 0, 0, 0.8);
- border-right: 6px solid transparent;
- border-left: 6px solid transparent;
-}
-.tooltip-bottom .tooltip-caret:after {
- bottom: 100%;
- left: 50%;
- margin-left: -6px;
- border-bottom: 6px solid rgba(0, 0, 0, 0.8);
- border-right: 6px solid transparent;
- border-left: 6px solid transparent;
-}
\ No newline at end of file
diff --git a/src/js/angular-tooltips.js b/src/js/angular-tooltips.js
deleted file mode 100644
index 0e24ae3..0000000
--- a/src/js/angular-tooltips.js
+++ /dev/null
@@ -1,109 +0,0 @@
-/*global angular*/
-
-(function withAngular(angular) {
-
- angular.module('720kb.tooltips', [])
- .directive('tooltips',[ '$window', '$compile', function manageDirective($window, $compile) {
-
- var TOOLTIP_SMALL_MARGIN = 8 //px
- , TOOLTIP_MEDIUM_MARGIN = 9 //px
- , TOOLTIP_LARGE_MARGIN = 10 //px;
-
- return {
- 'restrict': 'A',
- 'scope': {},
- 'link': function linkingFunction($scope, element, attr) {
-
- var thisElement = angular.element(element[0])
- , theTooltip
- , theTooltipElement
- , theTooltipHeight
- , theTooltipWidth
- , theTooltipMargin //used both for margin top left right bottom
- , theTooltipCaret
- , content = attr.tooltipContent || 'Some content !?'
- , side = attr.tooltipsSide || 'top'
- , size = attr.tooltipsSize || 'medium'
- , height = element[0].offsetHeight
- , width = element[0].offsetWidth
- , offsetTop = element[0].offsetTop
- , offsetLeft = element[0].offsetLeft
- , htmlTemplate = '
' + content + '
';
-
- //create tooltip
- thisElement.after($compile(htmlTemplate)($scope));
- //get tooltip element
- theTooltip = element[0].nextSibling;
- theTooltipElement = angular.element(theTooltip);
- //get tooltip dimension
- theTooltipHeight = theTooltipElement[0].offsetHeight;
- theTooltipWidth = theTooltipElement[0].offsetWidth;
- theTooltipCaret = angular.element(theTooltipElement[0].lastChild);
-
- thisElement.bind('mouseenter mouseover', function () {
-
- $scope.showTooltip();
- });
-
- thisElement.bind('mouseleave mouseout', function () {
-
- $scope.hideTooltip();
- });
-
- $scope.showTooltip = function showTooltip () {
-
- theTooltip.classList.add('tooltip-open');
- };
-
- $scope.hideTooltip = function hideTooltip () {
-
- theTooltip.classList.remove('tooltip-open');
- };
-
- $scope.tooltipPositioning = function tooltipPositioning (side) {
-
- if (size === 'small') {
-
- theTooltipMargin = TOOLTIP_SMALL_MARGIN
-
- } else if (size === 'medium') {
-
- theTooltipMargin = TOOLTIP_MEDIUM_MARGIN
-
- } else if (size === 'large') {
-
- theTooltipMargin = TOOLTIP_LARGE_MARGIN
- }
-
- if (side === 'left') {
-
- theTooltipElement.css('top', ((offsetTop + (height/2)) - (theTooltipHeight/2)) + 'px');
- theTooltipElement.css('left', offsetLeft + 'px');
- theTooltipElement.css('margin-left', '-' + (theTooltipWidth + theTooltipMargin) + 'px');
- }
-
- if (side === 'right') {
-
- theTooltipElement.css('top', ((offsetTop + (height/2)) - (theTooltipHeight/2)) + 'px');
- theTooltipElement.css('left', (offsetLeft + width + theTooltipMargin) + 'px');
- }
-
- if (side === 'top') {
-
- theTooltipElement.css('top', (offsetTop - theTooltipMargin - theTooltipHeight) + 'px');
- theTooltipElement.css('left', (offsetLeft + (width/2)) - (theTooltipWidth/2) + 'px');
- }
-
- if (side === 'bottom') {
-
- theTooltipElement.css('top', (offsetTop + height + theTooltipMargin) + 'px');
- theTooltipElement.css('left', (offsetLeft + (width/2)) - (theTooltipWidth/2) + 'px');
- }
-
- };
-
- $scope.tooltipPositioning(side);
- }
- };
- }]);
-}(angular));