sciter 透明背景界面透明

<!DOCTYPE html>
<html window-frame="transparent" window-resizable>
   <head>
   <meta charset="UTF-8">
<style>
html { background:transparent;}
   .fl{float:left}
   .fr{float:right}
   p, ul{margin:0;padding:0}
   li{list-style:none;}

.hover-div{display:none;position:absolute;top:-2dip;left:0dip;width:271dip;height:268dip;background: url(images/info.png) no-repeat bottom center}
#menu_pop:hover .hover-div{display:block;}

</style>

//view.move( evt.xScreen - xoff, evt.yScreen - yoff, true);
   /*   $(div) << event mousedragrequest (evt) {
            stdout.println("jin lai");

        var r = view.performDrag(#move );
        stdout.println(r);
        return true;
      };
    */

/*
//关闭按钮
$(#close).onClick = function()
{
    body.onAnimationEnd = ::view.close();
    body.attributes.removeClass("shown");
}

//点击之后最小化
$(#minimize).onClick = function()
{
    view.state = View.WINDOW_MINIMIZED;
}

   //时时监听鼠标消息
    function stopDrag()
    {
    界面生成后端返回true，

      return false;
    }

    function onMouseUp(evt) { return stopDrag(); }

   view.root.subscribe(onMouseMove, Event.MOUSE, Event.MOUSE_MOVE ); //事件的类型，鼠标在元素上移动
      */
    </script>
   <script type="text/tiscript">

//流量监视页面
const body = $(body);

//关闭按钮
$(#i3).onClick = function()
{
view.close();
}

function self.ready()
{
   view.windowTopmost = true;
    // positioning in the middle of the screen:
    var (sx,sy,sw,sh) = view.screenBox(#workarea,#rectw);
    var (w,h) = self.$(body).box(#dimension);
   // w = 220; // to accomodate expanding radii
    //h = 48;
stdout.println("w = "+w+"h = "+h);
    view.move( sx + sw -250, sy + sh -400, w, h);

}

function movable() // install movable window handler
{
    var xoff,yoff;
    var dragging = false;
    var body = $(body);

    function doDrag()
    {
      while( dragging )
        view.doEvent();
    }

      //按下后开始
    function onMouseDown(evt)
    {
   //var main = $(sendMouseEvent(mainButton = true));
   //    var main = sendMouseEvent(mainButton);
   //stdout.println("main = "+main);
     // if( evt.target !== body )
      // return false;
      xoff = evt.x;
      yoff = evt.y;
      dragging = true;
      view.root.capture(true);
      doDrag();
      return true;
    }

}

//var prop = sendMouseEvent(propButton);
//stdout.println(" prop = "+prop);

movable();
/*
mainButton //鼠标左点击
propButton //鼠标右点击
*/
</script>

</head>
<body>
   <div #menu_pop style="position:relative;color:#fff;width:202dip;height:290dip;background:url(images/float.png) no-repeat center bottom;">
       <div style="width: 100%;height:21dip;margin-top:271dip;">
           <p .fl style="margin-left:22dip;width:60dip;height:20dip;"><span #Below></span> k/s</p>
           <p .fl style="margin-left:23dip;width:60dip;height:20dip;"><span #Up></span> k/s</p>
       </div>
       <div .hover-div>
           <ul style="width:100%;margin-top:35dip;height:15dip">
               <li .fl #UpLoading style="width:60dip;margin-left:130dip">100.78M</li>
               <li .fr #Cpu style="width:45dip;">1%</li>
           </ul>
           <ul style="width:100%;margin-top:10dip">
               <li .fl #DwnLoading style="width:60dip;margin-left:130dip">06.78M</li>
               <li .fr #Mem style="width:45dip;">1%</li>
           </ul>
       </div>
   </div>

<div style="">
<menu .context id="context">
<li>Select an interface:
      <menu>
          <li id="i5">lntel[R] Ethernet Connection [2] 1219-V</li>
          <li id="i6">Reusable ISATAP lnterface {1C72A518-2F65-4F7D-A2FD-13312CD796A4}</li>
           <li id="i7">Local Connection* 10</li>
           <li id="i8">isatap.{D0AA53A7-56EE-4E86-8045-73893A183F3D}</li>
        </menu>
    </li>
    <li id="i1">Always show in foreground.</li>
    <li id="i2">Show details when mouse over</li>
    <li id="i3">Exit</li>

</menu>

</div>


</body>
</html>

来源：CSDN

作者：打小我就狂

链接：https://blog.csdn.net/qq_42095701/article/details/103830624

标签

event

context