Welcome 微信登录

首页 / 脚本样式 / JavaScript

JS组件Bootstrap Table使用方法详解

JS组件Bootstrap Table使用方法详解

最近客户提出需求,想将原有的管理系统,做下优化,通过手机也能很好展现,想到2个方案:a方案:保留原有的页面,新设计一套适合手机的页面,当手机访问时,进入m.zhy.com(手机页面),pc设备访问时,进入www.zhy.com(pc页面)b方案:采用bootstrap框架,替换原有页面,自动适应手机、平板、PC 设备采用a方案,需要设计一套界面,并且要得重新写适合页面的接口,考虑到时间及成本问题,故项目采用了b方案一、效果展示二、BootStrap tab...
Hammer.js+轮播原理实现简洁的滑屏功能

Hammer.js+轮播原理实现简洁的滑屏功能

最近有个任务,做一个非常小的h5的应用,只有2屏,需要做横向的全屏滑动切换和一些简单的动画效果,之前做这种东西用的是fullpage.js和jquery,性能不是很好,于是就想自己动手弄一个简单的东西来实现。最后我用zepto + hammer.js 和轮播的方式解决了这个问题,效果还不错,整个页面不开启Gzip时所有资源请求的数据大小为200KB左右。这篇文章总结下这个方法的实现思路。效果演示:1. 实现要点1)滑屏借鉴bootstrap的carouse...
基于JQuery实现图片轮播效果(焦点图)

基于JQuery实现图片轮播效果(焦点图)

自己写了一个纯jq形式的横向轮播焦点图,可点击小圆点或者左右按钮进行切换,属于定宽类型。改成自适应宽度的也不难,将css里面的bannerCon宽度改为百分比,再在js里面将ul和li的宽度跟随父级容器的宽度变化即可,需要用到$(window).resize。兼容到IE6+以上浏览器,有轮播速度和切换间隔两个参数可以改。效果图如下:Html代码如下:<html><head> <meta charset="utf-8"> ...
javascript实现瀑布流加载图片原理

javascript实现瀑布流加载图片原理

讲一下大概的原理吧,还是先上图:功能描述:根据不同菜单的属性值分别加载不同的数据下拉滚动条到一定位置预加载图片,滚动条拉到最底下的时候渲染html;鼠标移到菜单,切换各个图片列表;鼠标移到图片列表上,显示详细信息;技术实现方案: 先梳理一下从加载到显示的流程: 1. 加载数据 2. 拼接HTML写入到页面 3. 检查刚刚写入的HTML中的img是否全部加载完成,如果是,进入5、否则进入4 4. 等待图片加载完成 5. 计算每个元素的位置 一开...
原生js实现图片层叠轮播切换效果

原生js实现图片层叠轮播切换效果

本文实例介绍了js焦点图片层叠轮播切换滚动效果,分享给大家供大家参考,具体内容如下效果图:功能描述: 自定义图片尺寸; 每隔一段时间自动滚动图片; 每次动画执行的时候改变图片的位置,宽高以及其它属性也要跟随着变化; 鼠标移上图片,显示当前图片的详细信息; 点击按钮向前向后滚动;详细代码: html代码:<!DOCTYPE html><!-- saved from url=(0062)http://x1.xiuimg.com/s...
Webwork 实现文件上传下载代码详解

Webwork 实现文件上传下载代码详解

本文主要从三个方面给大家介绍webwork文件上传下载知识,包括以下三个方面:1. 包装 Request 请求2. 获取文件上传的解析类 3. 项目实战配置和使用Web上传和下载应该是很普遍的一个需求,无论是小型网站还是大并发访问的交易网站。WebWork 当然也提供了很友好的拦截器来实现对文件的上传,让我们可以专注与业务逻辑的设计和实现,在实现上传和下载时顺便关注了下框架上传下载的实现。 1. 包装 Request 请求•每次客户端请求 Ac...
JavaScript File API文件上传预览

JavaScript File API文件上传预览

对于基于浏览器的应用而言,访问本地文件都是一件头疼的事情,通常我们能做的仅仅是使用<input type="file">标签来上传文件。实现过程是:选取文件的时候value 属性保存了用户指定的文件的名称,表单被提交的时候,浏览器会向服务器发送选中的文件的内容而不仅仅是发送文件名。再获取服务器返回的地址,然后做预览。 但是如果有一天我们要上传一个图片,传了图片后预览想换另一张图片,就又得先上传到服务器再预览。在网络比较慢的情况下,这样真的很折...
详解Webwork中Action 调用的方法

详解Webwork中Action 调用的方法

本文主要通过三个方面给大家介绍webwork action调用相关知识,三个方面分别是:1.这部分框架类关系2.Webwork 获取和包装 web 参数3.DefaultActionProxyFactory、DefaultActionProxy、DefaultActionInvocation一路走来,终于要开始 webwork 核心业务类的总结,webwork 通过对客户端传递的 web 参数重新包装,进行执行业务 Action 类,并反馈执行结果,本篇源...
JavaScript File API实现文件上传预览

JavaScript File API实现文件上传预览

一、概述以往对于基于浏览器的应用而言,访问本地文件都是一件头疼的事情。虽然伴随着 Web 2.0 应用技术的不断发展,JavaScript 正在扮演越来越重要的角色,但是出于安全性的考虑,JavaScript 一直是无法访问本地文件的。于是,为了在浏览器中能够实现诸如拖拽并上传本地文件这样的功能,我们就不得不求助于特定浏览器所提供的各种技术了。比如对于 IE,我们需要通过 ActiveX 控件来获取对本地文件的访问能力,而对于 Firefox,同样也要借助...
javascript自定义滚动条实现代码

javascript自定义滚动条实现代码

在工作中经常会遇到内容会超出固定的一个范围,超出的内容一般会使用到滚动条来滚动显示。但是用浏览器默认的滚动条经常被产品经理鄙视,可是用css却改变不了滚动条的样式,还好,有万能的js ^_^~~网上有各种各样的插件,但最顺手的还是自己写的,还可以一边撸一边当学习,自己动手丰衣足食 (*^__^*)其中这三个问题深深地困扰我:1、滚动条高度2、每次点击向上、向下按钮的时候滚动条应该移动多少距离3、每拖动1px滚动条,页面需要移动多少?整个的框架大概是长这样的...
JavaScript+html5 canvas实现本地截图教程

JavaScript+html5 canvas实现本地截图教程

最近有时间了解了下html5的各API,发现新浪微博的头像设置是使用canvas实现截图的,加之前段时间了解了下html5的File API使用File API 之FileReader实现文件上传《JavaScript File API文件上传预览》,更加觉得html5好玩了,想着也试试写写这功能权当学习canvas吧。下面奉上我自己写的一个demo,代码写得比较少,很多细节不会处理。如果有不得当的地方恳请指教,谢谢啦 ^_^ ^_^功能实现步奏:一、获取...
Eclipse编辑jsp、js文件时卡死现象的解决办法汇总

Eclipse编辑jsp、js文件时卡死现象的解决办法汇总

使用Eclipse编辑jsp、js文件时,经常出现卡死现象,在网上百度了N次,经过N次优化调整后,卡死现象逐步好转,具体那个方法起到作用,不太好讲。将所有用过的方法罗列如下:1、取消验证windows–>perferences–>validation把 除了manual 下面的全部点掉,build下只留 classpath dependency Validator2、关闭拼写检查windows–>perferences–>gener...
<< 1291 1292 1293 1294 1295 1296 1297 1298 1299 1300 >>