修改follow的小三角css

aui · Jun 30, 2014 · f263501 · f263501
1 parent 643d1a3
commit f263501
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 36 deletions.
diff --git a/css/ui-dialog.css b/css/ui-dialog.css
@@ -250,35 +250,37 @@
 .ui-popup-right-bottom .ui-dialog {
     left: 8px;
 }
+
+/*默认让三角有8px, 不显示*/
 .ui-dialog-arrow-a,
 .ui-dialog-arrow-b {
     position: absolute;
-    display: block;
+    display: none;
     width: 0;
     height: 0;
     overflow:hidden;
-    line-height:0;
-    font-size: 0;
     _color:#FF3FFF;
     _filter:chroma(color=#FF3FFF);
+    border:8px dashed transparent;
 }
+
+/*如果有follow则显示小三角*/
+.ui-popup-follow .ui-dialog-arrow-a,
+.ui-popup-follow .ui-dialog-arrow-b{
+    display: block;
+}
+
 .ui-popup-top-left .ui-dialog-arrow-a,
 .ui-popup-top .ui-dialog-arrow-a,
 .ui-popup-top-right .ui-dialog-arrow-a {
-    bottom: -8px;
+    bottom: -16px;
     border-top:8px solid #7C7C7C;
-    border-bottom:0 none;
-    border-left:8px solid transparent;
-    border-right:8px solid transparent;
 }
 .ui-popup-top-left .ui-dialog-arrow-b,
 .ui-popup-top .ui-dialog-arrow-b,
 .ui-popup-top-right .ui-dialog-arrow-b {
-    bottom: -7px;
+    bottom: -15px;
     border-top:8px solid #fff;
-    border-bottom:0 none;
-    border-left:8px solid transparent;
-    border-right:8px solid transparent;
 }
 .ui-popup-top-left .ui-dialog-arrow-a,
 .ui-popup-top-left .ui-dialog-arrow-b  {
@@ -296,20 +298,14 @@
 .ui-popup-bottom-left .ui-dialog-arrow-a,
 .ui-popup-bottom .ui-dialog-arrow-a,
 .ui-popup-bottom-right .ui-dialog-arrow-a {
-    top: -8px;
+    top: -16px;
     border-bottom:8px solid #7C7C7C;
-    border-top:0 none;
-    border-left:8px solid transparent;
-    border-right:8px solid transparent;
 }
 .ui-popup-bottom-left .ui-dialog-arrow-b,
 .ui-popup-bottom .ui-dialog-arrow-b,
 .ui-popup-bottom-right .ui-dialog-arrow-b {
-    top: -7px;
+    top: -15px;
     border-bottom:8px solid #fff;
-    border-top:0 none;
-    border-left:8px solid transparent;
-    border-right:8px solid transparent;
 }
 .ui-popup-bottom-left .ui-dialog-arrow-a,
 .ui-popup-bottom-left .ui-dialog-arrow-b {
@@ -327,20 +323,14 @@
 .ui-popup-left-top .ui-dialog-arrow-a,
 .ui-popup-left .ui-dialog-arrow-a,
 .ui-popup-left-bottom .ui-dialog-arrow-a {
-    right: -8px;
+    right: -16px;
     border-left:8px solid #7C7C7C;
-    border-right:0 none;
-    border-top:8px solid transparent;
-    border-bottom:8px solid transparent;
 }
 .ui-popup-left-top .ui-dialog-arrow-b,
 .ui-popup-left .ui-dialog-arrow-b,
 .ui-popup-left-bottom .ui-dialog-arrow-b {
-    right: -7px;
+    right: -15px;
     border-left:8px solid #fff;
-    border-right:0 none;
-    border-top:8px solid transparent;
-    border-bottom:8px solid transparent;
 }
 .ui-popup-left-top .ui-dialog-arrow-a,
 .ui-popup-left-top .ui-dialog-arrow-b {
@@ -358,20 +348,14 @@
 .ui-popup-right-top .ui-dialog-arrow-a,
 .ui-popup-right .ui-dialog-arrow-a,
 .ui-popup-right-bottom .ui-dialog-arrow-a {
-    left: -8px;
+    left: -16px;
     border-right:8px solid #7C7C7C;
-    border-left:0 none;
-    border-top:8px solid transparent;
-    border-bottom:8px solid transparent;
 }
 .ui-popup-right-top .ui-dialog-arrow-b,
 .ui-popup-right .ui-dialog-arrow-b,
 .ui-popup-right-bottom .ui-dialog-arrow-b {
-    left: -7px;
+    left: -15px;
     border-right:8px solid #fff;
-    border-left:0 none;
-    border-top:8px solid transparent;
-    border-bottom:8px solid transparent;
 }
 .ui-popup-right-top .ui-dialog-arrow-a,
 .ui-popup-right-top .ui-dialog-arrow-b {

diff --git a/src/popup.js b/src/popup.js
@@ -541,7 +541,9 @@ $.extend(Popup.prototype, {
             temp[1][align[1]] = center[name[align[1]]];
         }
 
-        className += align.join('-');
+
+        //添加follow的css, 为了给css使用
+        className += align.join('-') + ' '+ this.className+ '-follow';
 
         that.__followSkin = className;