又是周末了,想着开始我的每周一切(每周做一次从切图到静态网页布局的练习)任务吧,无意间看了看别人的页面,发现——我去,这个动画挺有意思的啊,怎么实现的?然后翻代码+搜索,啊,原来是插件啊~给我的也用上!

animate.css,可实现多种动画功能!

使用方法见http://www.jq22.com/jquery-info819

然后我又发现,动画是实现了,可是一加载页面,从上到下动画一股脑全完事了,不对啊,别人是滚到到哪动画在哪开始,再找原因!这里有个wow.js是干嘛的?一查——

wow.js,依赖 animate.css,可实现滚动动画!而且很轻量级!

使用方法见http://www.dowebok.com/131.html

看来是不能闭门造车啊,要学的东西还是很多的,而且上面这两个都是支持自己定制的。

后来又想,我这个人主页做的是不是有点简陋啊,不能因为喜欢紫色,就整个页面全是紫色啊,来个图片是不是好点?OK,加个图片!可是。。页面一缩小,图片不能覆盖整个浏览器窗口了,怎么办?这么简单的问题,肯定得找CSS啊,原来:

background-size: cover;把背景图像扩展至足够大,以使背景图像完全覆盖背景区域。要的就是这个!

W3school要多看啊!

http://www.w3school.com.cn/cssref/pr_background-size.asp

后来给女朋友看了看,说你可不可以让这个背景图固定,不跟着滚动啊,我一想,这效果倒是经常见到,自己还没用过呢,查!

background-attachment: fixed;当页面的其余部分滚动时,背景图像不会移动。GET!

把这个和背景图放在body里,妥妥的的实现这个要求!

多学多看多想!前端还是挺有意思的!继续学习!

我的简陋主页:https://zhangcuizc.github.io/

——YC,你学到了吗?——学到了学到了的更多相关文章

  1. 学EE做硬件找工作不如学CS做软件,为什么会这样?

    学EE做硬件找工作不如学CS做软件,为什么会这样? 电子工程(EE)就业最好的方向居然是转计算机,也许让有的人觉得很不公平,EE也是很重要的学科,我们学习也很努力,为什么就业会不如CS?也有的人好奇, ...

  2. 我不是学Java的!我不是学Java的!我不是学Java的!。。。。【自我催眠中】

    我不是学Java的!我不是学Java的!我不是学Java的!....[自我催眠中]

  3. 以我的亲身经历,聊聊学python的流程,同时推荐学python的书

    因为干活要用到,所以我大概于19年5月开始学python,大概学了1个月后,我就能干公司的活了,而且这python项目还包含了机器学习等要素,大概3个月后,我还承担了项目里开发机器学习数据分析的任务. ...

  4. 【机器学*】k-*邻算法(kNN) 学*笔记

    [机器学*]k-*邻算法(kNN) 学*笔记 标签(空格分隔): 机器学* kNN简介 kNN算法是做分类问题的.思想如下: KNN算法的思想总结一下:就是在训练集中数据和标签已知的情况下,输入测试数 ...

  5. 为什么学完C语言觉得好像没学一般?

    不少同学从Hello world学到文件操作之后,回顾感觉会又不会? 学会了又感觉没学会?这种不踏实.模糊虚无的感觉?   原因在于编程不同于理论学科,你听懂和理解了理论就可以运用. 比如历史地理,看 ...

  6. 又到期末了,为什么学完C语言觉得好像没学一般?复习资料来一份

    不少同学从Hello world学到文件操作之后,回顾感觉会又不会? 学会了又感觉没学会?这种不踏实.模糊虚无的感觉? 原因在于编程不同于理论学科,你听懂和理解了理论就可以运用,比如历史地理,看完书, ...

  7. 【机器学*与R语言】2-懒惰学*K*邻(kNN)

    目录 1.理解使用KNN进行分类 KNN特点 KNN步骤 1)计算距离 2)选择合适的K 3)数据准备 2.用KNN诊断乳腺癌 1)收集数据 2)探索和准备数据 3)训练模型 4)评估模型的性能 5) ...

  8. 从零开始学 Java - 我放弃了 .NET ?

    这不是一篇引起战争的文章 毫无疑问,我之前是一名在微软温暖怀抱下干了近三年的 .NET 开发者,为什么要牛(sha)X一样去搞 Java 呢?因为我喜欢 iOS 阿!哈哈,开个玩笑.其实,开始学 Ja ...

  9. 本科小白学ROS 和 SLAM(一):杂谈

    本人最近才迷恋上ROS(Robot Operating System),准确的说应该是6月中旬,具体的记不清了(可能是年纪大了,容易健忘).对于一个电子DIY的狂热爱好者来说,我在校的梦想就是做一个属 ...

  10. 跟我学solr---吐槽一下,我的文章被抄袭啦

    今天闲来无事,就在在百度上搜了下面"跟我学solr",看看这几周来自己的努力成果怎么样,不搜还好,搜了就图学了.被原封不动地抄袭了!并且抄袭的文章还在百度排名第一,我自己的却被排到 ...

随机推荐

  1. iOS:CYLTabBarController【低耦合集成TabBarController】

    导航 与其他自定义TabBarController的区别 集成后的效果 项目结构 使用CYLTabBarController 第一步:使用CocoaPods导入CYLTabBarController ...

  2. listview1

    Edit1.Text := listview1.Items[i].Caption; //读第i行第1列 Edit2.Text := listview1.Items[i].SubItems.string ...

  3. php数组函数,字符串,linux命令

    1>> Linux常用命令一. 文件目录操作命令1. ls命令    命令格式:ls [选项] [目录名]    命令功能:列出目标目录中所有的子目录和文件.2. 命令格式:cd [目录名 ...

  4. 用python代码做configure文件

    在lua中,我一直用lua作为config文件,或者承载数据的文件 - 好处是lua本身就很好阅读,然后无需额外写解析的代码,还支持在configure文件中读环境变量,条件判断等,方便又强大! (在 ...

  5. ROS系统python代码测试之rostest

    ROS系统中提供了测试框架,可以实现python/c++代码的单元测试,python和C++通过不同的方式实现, 之后的两篇文档分别详细介绍各自的实现步骤,以及测试结果和覆盖率的获取. ROS系统中p ...

  6. Theano2.1.13-基础知识之PyCUDA、CUDAMat、Gnumpy的兼容

    来自:http://deeplearning.net/software/theano/tutorial/gpu_data_convert.html PyCUDA/CUDAMat/Gnumpy comp ...

  7. 基于DDD的.NET开发框架 - ABP Session实现

    返回ABP系列 ABP是“ASP.NET Boilerplate Project (ASP.NET样板项目)”的简称. ASP.NET Boilerplate是一个用最佳实践和流行技术开发现代WEB应 ...

  8. [转] Asp.net vNext webapi 自托管

    [声明]本文转自:http://www.cnblogs.com/ListenCode/p/4206204.html 转载需注明! 微软推出的Asp.net vNext(asp.net 5.0)的其中的 ...

  9. Oracle在中文环境下出现乱码解决办法

       zysong.ttf下载是一款oracle字体乱码解决工具,实质于缺乏中文字体包! 01情况的例子 02情况的例子 01.在开始安装的时候出现乱码 下载zysong.ttf,unzip 解压 一 ...

  10. android开发------编写用户界面之线性布局

    一个好的应用程序离不开人性化的用户界面.在学习其他东西之前.理应先学习编写程序的布局(外观) 今天,我们就来学习android的UI布局----LinearLayout. LinearLayout,即 ...