add alwaysByViewport

HISTORY.md

@@ -1,6 +1,10 @@
 # History
 ----
 
+## 1.11.0
+
+- add alwaysByViewport option
+
 ## 1.9.0
 
 - support shadow dom

README.md

@@ -95,9 +95,11 @@ domAlign(sourceNode, targetNode, alignConfig);
       </tr>
       <tr>
           <td>overflow</td>
-          <td>Object: `{ adjustX: true, adjustY: true }`</td>
-          <td>if adjustX field is true, then will adjust source node in x direction if source node is invisible.
+          <td>Object: `{ adjustX: boolean, adjustY: boolean, alwaysByViewport:boolean }`</td>
+          <td>
+          if adjustX field is true, then will adjust source node in x direction if source node is invisible.
           if adjustY field is true, then will adjust source node in y direction if source node is invisible.
+          if alwaysByViewport is true, the it will adjust if node is not inside viewport
           </td>
       </tr>
       <tr>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "dom-align",
-  "version": "1.10.4",
+  "version": "1.11.0",
   "description": "Align DOM Node Flexibly ",
   "keywords": [
     "dom",

src/align/align.js

@@ -87,8 +87,9 @@ function doAlign(el, tgtRegion, align, isTgtRegionVisible) {
   overflow = overflow || {};
   const newOverflowCfg = {};
   let fail = 0;
+  const alwaysByViewport = !!(overflow && overflow.alwaysByViewport);
   // 当前节点可以被放置的显示区域
-  const visibleRect = getVisibleRectForElement(source);
+  const visibleRect = getVisibleRectForElement(source, alwaysByViewport);
   // 当前节点所占的区域, left/top/width/height
   const elRegion = getRegion(source);
   // 将 offset 转换成数值，支持百分比

src/getVisibleRectForElement.js

@@ -5,7 +5,7 @@ import isAncestorFixed from './isAncestorFixed';
 /**
  * 获得元素的显示部分的区域
  */
-function getVisibleRectForElement(element) {
+function getVisibleRectForElement(element, alwaysByViewport) {
   const visibleRect = {
     left: 0,
     right: Infinity,
@@ -86,7 +86,7 @@ function getVisibleRectForElement(element) {
     element.style.position = originalPosition;
   }
 
-  if (isAncestorFixed(element)) {
+  if (alwaysByViewport || isAncestorFixed(element)) {
     // Clip by viewport's size.
     visibleRect.left = Math.max(visibleRect.left, scrollX);
     visibleRect.top = Math.max(visibleRect.top, scrollY);