悬浮框

1. 右侧底部悬浮框

运行效果图: [http://runjs.cn/code/zvjocat0]

要点:oDiv.style.top=document.documentElement.clientHeight-oDiv.offsetHeight+scrollTop;

2. 右侧中部悬浮框

运行效果图:[http://runjs.cn/code/bws1gmne]

要点: oDiv.style.top=Math.ceil((document.documentElement.clientHeight-oDiv.offHeight)/2+scrollTop);

时间: 2024-10-11 15:21:05

悬浮框的相关文章

小米Adnroid默认禁止悬浮框的使用,导致开发的悬浮框无法接收事件

比如你建了一个悬浮框: WindowManager windowManager = getWindowManager(context); int screenWidth = windowManager.getDefaultDisplay().getWidth(); if (smallWindow == null) { smallWindow = new FloatWindowSmallView(context); if (smallWindowParams == null) { smallWin

js实现页面悬浮框

当滚动条下拉时,悬浮框位置不变,主要是 position:fixed;样式的作用. 当下拉到一定程度,接近footer时,我用js控制div消失,往上拉滚动条时又显示. <!DOCTYPE html> <html> <head> <title></title> <style type="text/css"> .div1 { height:2000px; } .div2 { width:100%; height:35

“右侧悬浮框”页面特效

功能描述: 悬浮框固定在页面右下方,随着滚动条的滚动,悬浮框运动到固定位置. 实现效果: 编码思路: 获取滚动条滚动时,方块需要移动的目标位置(可视区域的高度-物体高度-滚动的高度). 套用运动框架. 示例代码:

JavaScript侧边悬浮框

<script> window.onscroll=function(){ var oDiv=document.getElementById('div1'); var scrollTop=document.documentElement.scrollTop||document.body.scrollTop; oDiv.style.top=(document.documentElement.clientHeight-oDiv.offsetHeight)/2+scrollTop+'px'; star

android悬浮框的使用

实质就是开启一个界面透明的activity 注意:在startService 想在startActivity intent必须要设置addFlags(Intent.FLAG_ACTIVITY_NEW_TASK); 直接上Demo---myFloat http://pan.baidu.com/s/1gdIK4QR android悬浮框的使用

使用悬浮框监听内存的使用状态 -- 附源码

源码下载地址:http://download.csdn.net/detail/hewence1/8176601 <span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">先看一下效果:  显示当前内存使用率55% ,每一秒都刷新一次</span> 实现原理,在Service中创建一个悬浮框就可,在service中每秒钟访问计算一次单

Echarts ecomfe 触摸屏 touch 在IE10下无法显示悬浮框

问题描述: Windows 8 IE10浏览http://echarts.baidu.com/doc/example/line2.html 时,鼠标放置在数据点上时无法显示悬浮框. 正常情况为: 而现在情况为: ? 问题分析: 公司有各种型号电脑,X230,W530,X240,业务部门多使用x240, 这一款笔记本屏幕带有触摸屏功能,其他型号没有.所有操作系统都为win8,IE10小版本号也一致. 最初就将问题定位为触摸屏引起了这个问题,但一直无法找到具体原因.因为在chrome,firfox等

Js实现一键分享效果--悬浮框状态

一.html框架 /*整个分享区域*/    <div id="share">         /*分享区域的顶端文字描述*/              <h3><img src="../img/chaohao.png">分享到...</h3>         /*分享区域的的具体分享网站链接*/              <ul>                    <li><a hr

(40)JS运动之右下角悬浮框

<!DOCTYPE HTML> <!-- --> <html> <head> <meta charset="utf-8"> <title></title> <style> #div1{ width:100px; height:150px; background:red; position:absolute; right:0; bottom:0; } </style> <s