关闭

前端小白系列(3)—— 分页

篇幅较长,废话不多说,直接开讲。 分页效果的具体思路可以参考博主的另一篇文章《分页效果实现》,其实最主要的思想就是在JS中传参进行递归,这点非常重要,有了这个思路其他代码便好写了。当然,这也只是提供一个参考方法。 上最终效果图 PC端   博主写分页功能的思路是先在HTML中写好a标签,然后写相关的样式和布局,再删掉HTML中的a标签,利用JS去动态生成。 按这个思路来走。先贴上最终的...
阅读(128) 评论(0)

前端小白系列(2)—— 适配与响应式

讲分页的相关制作前,博主还是先填下自己在背景那挖的坑吧。 首先是适配。在移动互联网时代,基本上企业都希望自己的网页可以很好的在移动设备上跑,所以做适配 很重要。关于适配方案,博主采用的是根据设备宽度除以定值来得到一个比例,再利用这个比例来换算px成rem的方案,具体有不清楚的可以参考这篇文章:http://www.cnblogs.com/lyzg/p/4877277.html 还有一种适配方案...
阅读(191) 评论(0)

前端小白系列(1)——背景

搭建好工程后,对于还没什么工作经验的博主决定先YY一下。 企业来说的话,前端手上应该会有设计图,之后便是了解清楚需求,再剖析整个项目的逻辑,整理出一个流程出来,理清好思路才能写得痛快。 好,YY结束。博主因为页面也没什么复杂的就直接省略以上步骤啦。 前面说到不能让页面那么“红果果”,于是博主第一件事便是去找图,而且一些组件功能如轮播图,可能也用得上,至于大家想贴什么图就随意了,只要不...
阅读(139) 评论(0)

前端小白系列(0)——工程构建

博主用gulp进行自动化构建。首先,nodejs是个好东西(别告诉我你接触前端到现在还不知道这玩意……),即使像我这样还没拿它来开发的小白也可以拿它来进行包管理,所以别废话先去下到你的PC再说,具体的下载安装配置过程就不赘述了。然后,用nodejs把gulp下载下来,进行gulp的相关搭建,此处可参考我的另一篇博文(或自行度娘),里面的链接有简述gulp的构建方式。 先贴上页面的目录结构吧。 ...
阅读(147) 评论(0)

前端小白系列之——导言

博主前端小白一枚,接触前端有小半年了,此次希望能专心从零开始做一个有自己特色本地页面,鞭挞下自己以严谨的规范代码写页面,顺便写成个系列,仅此而已。 这个页面一开始只是想着要实现前端常用的一些组件,像是轮播图、选项卡、弹窗等等,后来转念一想,这些组件直接“红果果”的在一个白底的页面上展示略显突兀,于心不忍,所以决心要做成个完整的页面。页面中可以通过点击不同的按钮来显示不同的组件功能效果,如果不知道...
阅读(107) 评论(0)

gulp-前端简单自动化

在微信公众号《前端迷》上看到的一篇关于 gulp 的工程化文章,很实用,分享下: http://mp.weixin.qq.com/s/C9Zcq-mz8Dqei9wi-RjTOQ...
阅读(98) 评论(0)

搜索框的js实现

功能:在搜索框输入后能够根据首字来进行智能提示,可通过鼠标或者键盘来进行选择。 只是模拟了下功能,数据是HTML里的的内容,回车功能可替换 HTML: 搜索: aac avad bjodf ccc cxz bsad carq asd JS: /* * 搜索框功能 * 数据是HTML里的li内容,可改从后台提取 * 只测...
阅读(164) 评论(0)

分页效果实现

JS实现: 1.页的标签是一些标签,设置一个变量表示当前页,则只有当前页的标签的内容是数字,其他为[数字] 2.可通过 函数名({json}) 的方式给函数传参,这样函数只需要写一个形参就好 3.json中传递的参数包括标签的父元素id,当前页,总页数和回调函数。 4.调用的函数的处理思路: 1.判断是否传进id,没有则返回false。 2.按照 首页>上一页>显示的可点击...
阅读(99) 评论(0)

jQuery Mobile-页面跳转

1. a 标签跳转 当我们的网站引用了jquery mobile的js后,点击页面的链接,你会发现页面无法跳转,因为jquery mobile默认是采用ajax方式来加载网站的,如果你需要跳到另一个页面,需要在a标签加上data-ajax="false"。 在同一个HTML页面创建多个在屏幕上显示的“页面”使得你可以大大减少页面加载的次数,但同时也会导致许多移动设备运行缓慢。 jQ...
阅读(191) 评论(0)

jQuery-级联表实现

级联表分为多层,只有上一层确定数据才会显示当前层。 HTML使用标签为数据分层,只需要填入第一层的数据即可,剩余层通过jQuery从服务器端导入数据。 通过CSS设置所需样式,隐藏掉(visibility 或 display)暂不显示的块,保留第一层供选择。 jQuery部分: 1.为各层设置 change 事件,处理下拉框数据变化后发生的事情。 2.在 change 事件中检测...
阅读(157) 评论(0)

jQuery-ajaxStart方法

1.8版本以上的jquery中ajaxStart只支持绑定到document。应该是这样的。             $(document).ajaxStart(function(){                 $("#div3").show().html("留言发送中..");             })             $(d...
阅读(203) 评论(0)
    个人资料
    • 访问:1634次
    • 积分:96
    • 等级:
    • 排名:千里之外
    • 原创:8篇
    • 转载:3篇
    • 译文:0篇
    • 评论:0条
    文章分类
    文章存档