web前端 - 随笔分类 - 南阳一小伙

WEB前端开发学习----12. JavaScript 选项卡效果

摘要：选项卡无处不在，记录一个简单的JS实现方法, 仿网易效果。当两个边框紧挨时，会变粗, 颜色也会变深，解决办法就是：margin-left:-1px, 按需修改top,left,right,bottom.[html]view plaincopy视频图片新闻视频视频视频视频视频视频视频视频视频视频视频视... 阅读全文

posted @ 2014-12-22 23:19 南阳一小伙阅读(374) 评论(0) 推荐(0)

WEB前端开发学习----11. JQuery 实现简单的拖拽效果

摘要：拖拽效果在网页中很常见。实现起来也不难。记录一下今天实现的简单效果。拖拽演示快速拖动时，会出现问题，以后修改.说白了，就是3个点击事件。1. 按下鼠标左键，触发点击事件，此时记录下可以得到鼠标相对于拖动控件的位置（当前鼠标位置-控件位置）；2. 拖动鼠标，触发移动事件，可以计算出鼠标移动的距离（当... 阅读全文

posted @ 2014-12-22 23:10 南阳一小伙阅读(347) 评论(0) 推荐(0)

WEB前端开发学习----10. canvas实现画板的两个方法

摘要：方法1：查看演示点击鼠标作画此方法就是鼠标移动的时候不停的画小圆点，然后用等粗的线将小圆点串起来（有点类似于珍珠项链）。因为是小圆点，所以效果要比方法2好，比较平滑。方法2：查看演示点击鼠标作画这个方法很容易理解，就是不断的将鼠标所在的位置用线段连起来。缺点是不够平滑，尤其是粗线条的时候。方法1：[... 阅读全文

posted @ 2014-12-22 23:04 南阳一小伙阅读(162) 评论(0) 推荐(0)

WEB前端开发学习----9. 使用canvas来画个时钟

摘要：canvas元素在html5中的重要性非同一般。配合JS让我们实现了在浏览器页面中作画的强大功能。不再单单依靠图片，flash等外部文件，减少http请求，从而网页加载速度更加快捷。简单的线段：看个小演示 canvas小房子不用函数累死人。。。。旋转：使用提供的rotate()方法。需要注意的是，在... 阅读全文

posted @ 2014-12-22 22:56 南阳一小伙阅读(239) 评论(0) 推荐(0)

WEB前端开发学习----8. Html5一些新增标签

摘要：先看一张图明显看出Html5的页面布局方式要比html4.0 div+css传统布局模式简洁许多，同时对搜索引擎更加友好。语义化标签的好处就不多说了。说几个有意思的新增标签：显示一个测量计，可用于温度，气压等meter演示显示一个进度条，配合js可以显示动态加载效果。用于加载进度，下载进度等。p... 阅读全文

posted @ 2014-12-22 22:49 南阳一小伙阅读(132) 评论(0) 推荐(0)

WEB前端开发学习----7.JavaScript 中 var 的重要性

摘要：javascript 是弱数据型语言，也就是说声明变量时不需要指定数据类型。而是在执行时由浏览器中的js引擎来决定。一般来说，我们需要用var来声明变量，但是写不写有什么区别呢？先看一段代码：[html]view plaincopy运行结果为 100 ，3 ，100经过测试，就结果就很清楚了。在局部... 阅读全文

posted @ 2014-12-22 22:47 南阳一小伙阅读(212) 评论(0) 推荐(0)

WEB前端开发学习----6.CSS 和 JS 在html的使用方法

摘要：CSS的导入总共有四大方法：1. 行内式：直接在html标签元素内嵌入css样式（不推荐）2.嵌入式：在html头部head部分内插入style声明3.导入式：使用@import引用外部CSS文件方法：4.链接式：使用link来调用外部的css文件（推荐）：外部css文件中，不用标签。一般来，常见的... 阅读全文

posted @ 2014-12-21 23:23 南阳一小伙阅读(273) 评论(0) 推荐(0)

WEB前端开发学习----5.理解 CSS 浮动float

摘要：首先需要明白两个概念：内联元素，块元素。内联元素：也叫做行内元素，可以容纳文字或其他内联元素。内联元素的高度宽度都是不可以设置的，其宽度就是自身文字或者图片的宽度，不会进行换行。常见的内联元素：, , , , 等块元素：可以容纳文本，其他内联元素和块元素。可以设置其高度宽度。排斥与其他元素位... 阅读全文

posted @ 2014-12-21 22:41 南阳一小伙阅读(432) 评论(0) 推荐(0)

WEB前端开发学习----4.用JavaScript实现网页游戏的移动效果

摘要：想必大家都玩过网页游戏吧。随着HTML5的普及，浏览器+云端的web app成为了未来的趋势。很多效果都离不开JavaScript。所以说要想进行web开发，JavaScript一定得学好。那网页游戏中是怎么实现人物的移动效果呢，今天分享一个很基础的简单方法。效果图如下：点击上边的按钮，暴走... 阅读全文

posted @ 2014-12-21 22:22 南阳一小伙阅读(293) 评论(0) 推荐(0)

WEB前端开发学习----3.HTML表单form标签

摘要：什么是表单？表单就是用来搜集不同类型的用户输入。比如我们登录时输入的登录名，密码。再比如我们点击登录按钮，删除按钮等等都算是表单。表单是一个包含表单元素的区域，包括文本域，下拉菜单，复选框，单选框等等。在html文档中，我们使用标签来包含表单元素。form标签有两个属性需要注意下，一个是action... 阅读全文

posted @ 2014-12-21 22:17 南阳一小伙阅读(246) 评论(0) 推荐(0)

WEB前端开发学习----2.HTML表格table标签

摘要：[html]view plaincopycss没用流行之前，网页都是用表格，也就是table标签制作的。虽然现在不用table做网页了，但是我们还是应该掌握这个标签。先给出最表格的基本格式：[html]view plaincopy 其中为行标签，即表格的行。为单元格数据标签。也就是说一个表格为3行3... 阅读全文

posted @ 2014-12-21 22:14 南阳一小伙阅读(230) 评论(0) 推荐(0)

WEB前端开发学习----1.HTML基础

摘要：1.HelloWorld!首先说一下html的基本格式，是必须要有的。[html]view plaincopy 不用多说，按照惯例，我们来制作第一个HTML文档。非常简单，打开文本编辑器，录入以下代码，保存为HelloWorld.html即可。[html]view plaincopyHelloWor... 阅读全文

posted @ 2014-12-21 22:06 南阳一小伙阅读(236) 评论(0) 推荐(0)

WEB前端开发学习----简介

摘要：放暑假没事，看到网上关于HTML5 和 CSS3的讨论很多。所以想要趁暑假学习一下web前端。由于HTML与CSS入门比较轻松，所以我认为可以同时进行HTML, CSS和JavaScript 的学习。今天是第一天的学习记录。全是大白话方便理解。 1 什么是web前段？我们看到的网站一般分为两... 阅读全文

posted @ 2014-12-21 21:53 南阳一小伙阅读(205) 评论(0) 推荐(0)

随笔分类 - web前端