仿Ios assistiveTouch 悬浮辅助球工具

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

        <style type="text/css">

            .assistive-wrap{

                        width: 58px;

                        height: 58px;

                        position: fixed;

                        top: 50%;

                        margin-top: -29px;

                        left: 1px;

                    }

                    .assistive-touch{

                        width: 100%;

                        height: 100%;

                        background: #343434;

                        border-radius: 10px;

                        opacity: .3;

                        position: relative;

                    }

                    .assistive-touch:before, .assistive-touch:after, .assistive-touch span{

                        content: '';

                        position: absolute;

                        border-radius: 100%;

                        box-shadow: 0 0 2px rgba(30, 30, 30, .5);

                        display: block;

                        background: rgba(255, 255, 255, .6);

                    }

                    .assistive-touch:before{

                        width: 42px;

                        height: 42px;

                        left: 8px;

                        top: 8px;

                        opacity: .5;

                    }

                    .assistive-touch span{

                        width: 34px;

                        height: 34px;

                        left: 12px;

                        top: 12px;

                    }

                    .assistive-touch:after{

                        width: 26px;

                        height: 26px;

                        left: 16px;

                        top: 16px;

                        background: #fff;

                    }

        </style>

    </head>

    <body>

        <div class="assistive-wrap">

            <div class="assistive-touch">

                <span></span>

            </div>

        </div>

    </body>

</html>

Html - 仿Ios assistiveTouch 悬浮辅助球工具的更多相关文章

  1. android 仿ios 对话框已封装成工具类

    对话框 在android中是一种非经常见的交互提示用户的方式,可是非常多产品狗都叫我们这些做android的仿ios,搞的我们android程序猿非常苦逼,凭什么效果老是仿ios,有没有一点情怀,只是 ...

  2. Ion-affix & Ion-stick 仿IOS悬浮列表插件

    Ion-affix & Ion-stick 仿IOS悬浮列表插件 Ion-affix 1.相关网页 Ion-affix 2.环境准备: 执行命令 bower install ion-affix ...

  3. fir.im Weekly - 17 个提升 iOS 开发效率的必备工具

    本期 fir.im Weekly 精选了一些iOS 开发工具和动画源码分享,希望每个开发者能专注效率.实用.灵感.  iOS开发工具--如何优化ipa包大小 @iOS程序犭袁 推荐了关于"如 ...

  4. iOS及时log日志查看工具 （iConsole）

    github下载地址:https://github.com/nicklockwood/iConsole 偶然看到的一个iOS及时log日志查看工具,通过该工具,我们可以在任何想看日志的时候,通过手势呼 ...

  5. 20个可以帮你简化iOS app开发流程的工具

    这里推荐20个可以帮你简化iOS app开发流程的工具.很多开发者都使用过这些工具,涉及原型和设计.编程.测试以及最后的营销,基本上涵盖了整个开发过程. 原型和设计 有了一个很好的创意后,你要做的不是 ...

  6. IOS开发之网络开发工具

    IOS开发之网络开发工具 做移动端开发  常常会涉及到几个模块:1.网络检測   2.网络请求get和post请求  3.文件上传  4.文件下载   5.断点续传 如今将这些一一分享给大家 ,也欢迎 ...

  7. Android仿IOS回弹效果 ScrollView回弹 总结

    Android仿IOS回弹效果  ScrollView回弹 总结 应项目中的需求  须要仿IOS 下拉回弹的效果 , 我在网上搜了非常多 大多数都是拿scrollview 改吧改吧 试了一些  发现总 ...

  8. WPF 辅助开发工具

    原文:WPF 辅助开发工具 以下介绍的工具均为免费版,有些是源代码开放,希望对大家有用. Kaxaml 轻量级XAML 编辑器,可以同时进行图像和XAML 代码的编辑.最终生成开发人员想要的XAML ...

  9. vue 2 仿IOS 滚轮选择器 从入门到精通 （一）

    大家好,由于最近从事的是微信公众号和APP内嵌 H5开发,避免不了开发一些和native相同的操作功能,就如接下来说的 仿IOS滚轮选择器. 先来个截图: 接下来具体介绍如何实现的.能力有限避免不了错 ...

随机推荐

  1. Android数据存储之SQLite的操作

    Android作为一个应用在移动设备上的操作系统,自然也就少不了数据的存储.然而SQLite作为一个轻型的关系型数据库,基于其轻量.跨平台.多语言接口及安全性等诸多因数考虑,因而Android较大的数 ...

  2. LINUX_bash

    $ myname=xor$ echo $myname xor 内容间空格$var="lang is $myname" echo $var lang is xor $ var='la ...

  3. redis的PHP扩展包安装方法

    试用Redis安装.php环境连接.测试  Redis介绍     Redis本质上一个Key/Value数据库,与Memcached类似的NoSQL型数据库,但是他的数据可以持久化的保存在磁盘上,解 ...

  4. Windbg 双机代码同步调试设置

    Windbg的设置 Windbg的设置 Windbg本身可以直接从微软的网站上下载下载地址:http://www.microsoft.com/whdc/devtools/debugging/defau ...

  5. MATLAB信号与系统分析（一）——连续时间信号与系统的时域分析

    一.连续时间信号的表示: 1.向量表示法: 在MATLAB中,是用连续信号在等时间间隔点的样值来近似表示连续信号,当取样时间间隔足够小时,这些离散的样值就能较好地近似出连续信号. 对于连续时间信号f( ...

  6. cocos2dx游戏开发——微信打飞机学习笔记（七）——Enemy的搭建

    一.文件创建~ Enemy.h Enemy.cpp 二.How to do? 由于我是已经完成成个游戏的功能,所以我会将游戏中enemy所需要的很多功能基本上都先考虑到了,如果大家自己在做的时候也许没 ...

  7. cocos2dx游戏开发——微信打飞机学习笔记（十）——碰撞检测的搭建

    一.七说八说        大家都发现了= =,做了那么多,发现就是摆设,完全没有打飞机的感觉,没有实现碰撞的监测.比如说呢,子弹和敌机,玩家与敌机就是需要有碰撞检测的说,然后在这篇我想会很长很长的教 ...

  8. Hark的数据结构与算法练习之计数排序

    算法说明 计数排序属于线性排序,它的时间复杂度远远大于常用的比较排序.(计数是O(n),而比较排序不会超过O(nlog2nJ)). 其实计数排序大部分很好理解的,唯一理解起来很蛋疼的是为了保证算法稳定 ...

  9. Loadrunner请求自定义的http(json)文件and参数化

    Loadrunner请求自定义的http(json)文件and参数化      研究啦好些天这个东西啦 终于出来答案啦 嘿嘿 给大家分享一下 : 请求自定义的http文件用函数:web_custom_ ...

  10. JIT晚期(运行期)

    在部分的商用虚拟机(Sun HotSpot.IBM J9)中,Java程序最初是通过解释器(Interpreter)进行解释执行的,当虚拟机发现某个方法或代码块的运行特别频繁时,就会把这些代码认定为& ...