仿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. iOS 关于多线程的一些知识点（不断更新）

    1.NSOperation 对于NSOperation,In OS X v10.6 and later, operation queues ignore the value returned by t ...

  2. 转MYSQL学习（三） 函数

    这一节主要介绍MYSQL里的函数,MYSQL里的函数很多,我这里主要介绍MYSQL里有而SQLSERVER没有的函数 数学函数 1.求余函数MOD(X,Y) MOD(X,Y)返回x被y除后的余数,MO ...

  3. codeforces A. The Wall 解题报告

    题目链接:http://codeforces.com/problemset/problem/340/A 这道题目理解不难,就是在[a, b]区间内,找出同时能够被x和y整除的个数.第一次想当然的开了两 ...

  4. UML状态图和活动图

    UML状态图和活动图 统一建模语言UML(Unified Modeling Language)是非专利的第三代建模和规约语言.UML是一种开放的方法,用于说明.可视化.构建和编写一个正在开发的.面向对 ...

  5. 源码安装mysql-5.6.32.tar.gz

    http://mirrors.sohu.com/mysql/MySQL-5.6/mysql-5.6.32.tar.gz 安装依赖包: #yum install wget bison gcc gcc-c ...

  6. PIGOSS

    http://blog.sina.com.cn/s/blog_865bc4c60102wkb1.html

  7. mac 下修改Hosts文件

    最近Google网站老是打不开,具体原因大家都明白,不过修改Hosts文件后,就能访问了,也算不上原创,网上一搜就能找到,自己操作记录下,希望有刚接触Mac 系统的童鞋有帮助. 第一步:打开Finde ...

  8. Java Hour 12 Generic

    有句名言,叫做10000小时成为某一个领域的专家.姑且不辩论这句话是否正确,让我们到达10000小时的时候再回头来看吧. 本文作者Java 现经验约为12 Hour,请各位不吝赐教. 泛型程序设计 为 ...

  9. vijos 1037 ***

    链接:点我 #include <cstdio> #include <cstring> #include <algorithm> #include <iostr ...

  10. 从源码编译Chrome(chromium)

    转自:http://www.udpwork.com/item/13827.html 官网描述 http://www.chromium.org/developers/how-tos/build-inst ...