仿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. mysql in 查询优化

    2014年11月29日21:01:01 场景:有的时候查询数据库的select in 语句中会有非常多不连续的数值,会很影响查询效率 方法:将select in 查询转换成多个select betwe ...

  2. （转）SQL server 容易让人误解的问题之 聚集表的物理顺序问题

    对于MS SQL server 数据库,有几个容易让人产生误解的问题,对于这几个问题,即使很多 SQL server DBA 都有错误认识或者认识不充分,所以我想撰文几篇,把这些容易理解错误的问题前前 ...

  3. Java for LeetCode 169 Majority Element

    Given an array of size n, find the majority element. The majority element is the element that appear ...

  4. Java for LeetCode 024 Swap Nodes in Pairs

    Given a linked list, swap every two adjacent nodes and return its head. For example, Given 1->2-& ...

  5. 双系统重装windows后修复UBUNTU的GRUB

    1.问题背景 本子是win7和ubuntu10.04双系统,用的还算好,虽然只有在用QQ的时候还会用到win7,但还是保留windows.可是几天 前,win7突然总是蓝屏.死机,更重要是的背景变成黑 ...

  6. ORACLE查询某一字段重复的数据

    第一种方法: select a.*  from ASSET_MAINTAIN a inner join ASSET_MAINTAIN b on a.asset_id=b.asset_id and a. ...

  7. 【python】filter()

    来源:http://www.jb51.net/article/54316.htm filter函数: filter()函数可以对序列做过滤处理,就是说可以使用一个自定的函数过滤一个序列,把序列的每一项 ...

  8. 自定义view实现水波纹效果

    水波纹效果: 1.标准正余弦水波纹: 2.非标准圆形液柱水波纹: 虽说都是水波纹,但两者在实现上差异是比较大的,一个通过正余弦函数模拟水波纹效果,另外一个会运用到图像的混合模式(PorterDuffX ...

  9. Fresco 源码分析(二) Fresco客户端与服务端交互(1) 解决遗留的Q1问题

    4.2 Fresco客户端与服务端的交互(一) 解决Q1问题 从这篇博客开始,我们开始讨论客户端与服务端是如何交互的,这个交互的入口,我们从Q1问题入手(博客按照这样的问题入手,是因为当时我也是从这里 ...

  10. Java Hour 41 Maven ( 3 )

    有句名言,叫做10000小时成为某一个领域的专家.姑且不辩论这句话是否正确,让我们到达10000小时的时候再回头来看吧. 41.1 m2eclipse 简介 m2eclipse 是一款开源工具,为ec ...