1. <!DOCTYPE html>
  2. <html style="height: 100%">
  3. <head>
  4.     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  5.     <title>Insert title here</title>
  6.     <script src="jquery.js"></script>
  7.     <style type="text/css">
  8.  
  9.         span{display: inline-block;background:linear-gradient(blue 10%,green);margin-right: 20px;font-size: 30px;margin-top: 10px;border-radius: 5px;color:white;font-weight:bold }
  10.  
  11.     </style>
  12. </head>
  13. <body style="height: 100%">
  14. <div id="aa">　贝壳，大家一定都不陌生吧?在海滩，就有一个又一个、千奇百怪的贝壳。这次的综合课我们就做了一次贝壳工艺品。 </div>
  15. <input type="button" value="bigbang" onclick="bang()">
  16. <div id="bb"></div>
  17. <script type="text/javascript">
  18.  
  19.     var ww=$('#aa').html().split("")
  20.     var dd=ww.map(function(key){
  21.         return '<span>'+key+'</span>';
  22.     })
  23.     function bang(){
  24.         $('#bb').html(dd.join(''));
  25.     }
  26. </script>
  27. </body>
  28. </html>

　　

模仿锤子手机的bigbang效果的更多相关文章

  1. 分享：关于之前锤子手机刷MIUI之后，现在有事跌宕起伏的刷回了Smartisan OS！

     序言: 距离上次把锤子手机刷成MIUI之后已经一个半月了,我是一个刷机党,一个半月足够让我适应一个系统,了解一个系统.刷机有风险,不过我愿意冒这个风险,因为兴趣,没别的.刷机之后,肯定是有问题的,没 ...

  2. Android Studio新建了一个项目看不到手机界面的效果

    我今天新建了一个项目,但是在这里却看不到手机的界面效果,如下图:

  3. 仿360手机卫士界面效果android版源码

    仿360手机卫士界面效果android版,这个今天一大早在源码天堂的那个网站上看到了一个那个网站最新更新的一个源码,所以就分享给大学习一下吧,布局还挺不错的,而且也很简单的,我就不把我修改的那个分享出 ...

  4. 模仿京东顶部搜索条效果制作的一个小demo

    最近模仿京东顶部搜索条效果制作的一个小demo,特贴到这里,今后如果有用到可以参考一下,代码如下 #define kScreenWidth [UIScreen mainScreen].bounds.s ...

  5. wpf 模拟3D效果(和手机浏览图片效果相似)（附源码）

    原文 wpf 模拟3D效果(和手机浏览图片效果相似)(附源码) pf的3D是一个很有意思的东西,类似于ps的效果,类似于电影动画的效果,因为动画的效果,(对于3D基础的摄像机,光源,之类不介绍,对于依 ...

  6. 【Demo】jQuery 图片放大镜效果——模仿淘宝图片放大效果

    实现功能: 模仿淘宝图片放大效果,鼠标移动到小图片的某一处,放大镜对应显示大图片的相应位置. 实现效果: 实现代码: <!DOCTYPE html> <html> <he ...

  7. PPT制作手机手指滑动效果

    原文链接:https://www.toutiao.com/i6495304998786695694/ 上一节我们完成了手机滑动粗糙效果,这部分我们将给动画添加一个手指的图片. 首先,选择"插 ...

  8. 锤子OneStep及BigBang使用体验

    令人期待的Smartisan OS v3.1.2终于推送了,第一时间下载了更新.几乎花了半个小时才升级完毕,捧着还热乎的手机,赶忙体验一下传说中的两大杀器:OneStep以及BigBang. 先说On ...

  9. 分享：大晚上用自己的锤子手机跨系统刷MIUI，跌宕起伏啊！！

    序言: 写这篇博客之前问了一下博客园官方,能不能写关于刷机这一方面的,官方还是比较通情达理的,说技术类没有限制的,那样我就放心的写了.今天早上在博客园中稍微逛了一下,感觉似乎很少有关于刷机这一方面的, ...

随机推荐

  1. Nginx: ubuntu系统上查找nginx.conf配置文件的路径

    问题描述:在ubuntu系统上,找到nginx.conf文件的位置. 解决方法:在终端窗口中,输入命令:nginx -t 回显中就可以看到nginx.conf文件的路径了. 参考:https://bl ...

  2. 【Machine Learning is Fun!】1.The world’s easiest introduction to Machine Learning

    Bigger update: The content of this article is now available as a full-length video course that walks ...

  3. C/C++ 数组与指针

    #include <iostream>using namespace std;int main(){ char *a[]={"ab","ccs",& ...

  4. NOIP2013 表达式求值

    题目描述 Description 给定一个只包含加法和乘法的算术表达式,请你编程计算表达式的值. 输入描述 Input Description 输入仅有一行,为需要你计算的表达式,表达式中只包含数字. ...

  5. A. Vitya in the Countryside

    A. Vitya in the Countryside time limit per test 1 second memory limit per test 256 megabytes input s ...

  6. matplotlib绘图（一）

    绘制这折现图 导入响应的包 import numpy as npimport pandas as pdfrom pandas import Series,DataFrame%matplotlib in ...

  7. Python PycURL的安装使用

    PycURL中文简介:https://blog.csdn.net/qq_41185868/article/details/80487014 PycURL英文简介(如下):http://pycurl.i ...

  8. LeetCode（162） Find Peak Element

    题目 A peak element is an element that is greater than its neighbors. Given an input array where num[i ...

  9. CSS效果小结

    效果属性 1.box-shadow(盒子阴影) 示例 加上 box-shadow 内阴影 复杂例子 阴影的形状跟原来的形状是一样的 结果: box-shadow 作用:1.营造层次感(立体感)2.充当 ...

  10. WIN 备份 重装

    title: WIN 备份 重装 date: 2018-09-01 22:35:31 updated: tags: [windows,记录,折腾] description: keywords: com ...