sciter 列表弹窗

最新推荐文章于 2023-10-09 14:32:12 发布

打小我就狂

最新推荐文章于 2023-10-09 14:32:12 发布

阅读量228

点赞数

分类专栏： sciter

本文链接：https://blog.csdn.net/qq_42095701/article/details/103404505

版权

sciter 专栏收录该内容

65 篇文章 6 订阅

订阅专栏

<html>
<head>
<style>

    popup#test
    {
      background-color: orange;
      border:1dip solid red;
      width:100dip;
      height:100dip;
      cursor:pointer;
      border-radius: 12dip;
    }
    div#anchor
    {
      border:1px solid blue;
      width:50dip;
      height:50dip;
      cursor:pointer;
    }

    popup#test > div {
      background:red; size:10dip;
    }
    popup#test > div:hover {
      background:blue;
    }

</style>
<style #actions>
    div#anchor
    {
      behavior: button;
    }
</style>
<script type="text/tiscript">

      $(div#anchor) << event mousedown
      {
        if(!this.state.ownspopup) {
          var anchorPoint = $(select#anchor-point).value;
          var popupPoint = $(select#popup-point).value;
          this.popup( $(popup#test), (popupPoint << 16) | anchorPoint);
        }
      }

      // close popup on mouseup inside it
      event ~mouseup $(popup) {
        this.state.popup = false;
      }


    </script>

</head>
<body>

   popup point (see num keypad):
   <select #popup-point>
     <option value=1>1 - left/bottom</option>
     <option value=2>2 - middle/bottom</option>
     <option value=3>3 - right/bottom</option>
     <option value=4>4 - left/middle</option>
     <option value=5>5 - middle/middle</option>
     <option value=6>6 - right/middle</option>
     <option value=7>7 - left/top</option>
     <option value=8 selected>8 - middle/top</option>
     <option value=9>9 - right/top</option>
   </select> is on anchor point:
   <select #anchor-point>
     <option value=1>1 - left/bottom</option>
     <option value=2 selected>2 - middle/bottom</option>
     <option value=3>3 - right/bottom</option>
     <option value=4>4 - left/middle</option>
     <option value=5>5 - middle/middle</option>
     <option value=6>6 - right/middle</option>
     <option value=7>7 - left/top</option>
     <option value=8>8 - middle/top</option>
     <option value=9>9 - right/top</option>
   </select>
   <p>Choose position above and click on the anchor:</p>
    <div#anchor>
      anchor
    </div>
    <popup #test>
      popup
      <div></div>
    </popup>

</body>
</html>

打小我就狂

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
sciter 列表弹窗

<html><head> <style> popup#test { background-color: orange; border:1dip solid red; width:100dip; height:100dip; cursor:pointer; borde...
复制链接

扫一扫

专栏目录