【Js 时间轴和拓扑图】的更多相关文章

Js 时间轴和拓扑图

http://code.csdn.net/news/2819345 http://visjs.org/…

JS时间轴效果(类似于qq空间时间轴效果)

在上一家公司写了一个时间轴效果,今天整理了下,感觉有必要写一篇博客出来 给大家分享分享 当然代码还有很多不足的地方,希望大家多指点指点下,此效果类似于QQ空间或者人人网空间时间轴效果,当时也是为了需求 研究了下qq空间逻辑(当然JS代码压缩了肯定看不到的),只是当时研究了下他们HTML结构和css结构,所以仿照他们那种逻辑自己也写了一个出来.先来看看是个什么样的吧!如下图所示: 需求分析:左侧是一个时间列表 右侧是一个时间控制抽,当时的需求是这样的:默认页面一打开 只加载当前年份所有列表加载出来…

jQuery时间轴插件timeline.js

http://www.jq22.com/jquery-info13695 http://www.jq22.com/jquery-info13357 简要教程 timeline.js是一款jQuery时间轴幻灯片插件.通过timeline.js插件,你可以很容易的制作出水平或垂直时间轴效果,并可以像幻灯片一样前后切换时间点. 使用方法 在页面中引入jquery和timeline.min.js文件,以及样式文件timeline.min.css. 1 2 3 <link rel="stylesh…

纯css+js水平时间轴

自定义,并自动加载时间节点 当前时间节点居中,突出显示 时间动态无痕添加 效果图: 初始状态 时间左走到一定2016.1月后 html: <!-- 水平时间轴 --> <div id="timeline" style="width: 902px; height: 60px;"> <ul id="dates" style="position: absolute; right: 0; top: -10px;&q…

highcharts.js的时间轴折线图

工作中正好用到. 鼠标按住左键 左右移动可以试试 <!DOCTYPE> <html lang='en'> <head> <title>4-Highcharts曲线图之时间轴折线图</title> <meta http-equiv="content-type" content="text/html;charset=utf-8"> <script src="../jquery-2.1…

js实现的时间轴效果

今天整理以前的资料发现以前写的一个时间轴效果,当时也是网上找了很久没有找到,就自己写了一个,现在发出来给有需要的人,代码写的可能有点乱. 效果图: 下面是美工做的设计图的效果(有个美工就是好): 下面是客户端源代码: <html> <head> <style type="text/css"> #container { font-size: 12px; background-color: #ffffff; border: 1px solid #cccc…

SmohanTimeLine.js 酷炫的时间轴效果

展示地址 点此下载 原文出处 一.参数说明 item : '.item', //项目元素 top : 30, //与下一行的间距 pointWidth : 22, //时间点宽度 cornerWidth : 22, //corner宽度 scroll : true //点击时间点,是否滑动 二.CSS样式 /*时间轴样式*/ #TimeLine{width:100%;height:auto;min-height:600px;position:relative;padding:20px 0;mar…

08. Web大前端时代之：HTML5+CSS3入门系列 ~ QQ空间时间轴

Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 大前端系列,主要就是使用CSS3.0来实现,注释我已经打在代码里面了,直接看代码就可以了,后面会说一下CSS3.0系列,这个就当一个引入吧: 简单版本: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="…

[原创]首次制作JQueryUI插件-Timeline时间轴

特点: 1. 支持多左右滚动,左右拖动. 2. 时间轴可上下两种显示方式. 3. 支持两种模式的平滑滚动/拖动. 4. 行压缩(后续版本此处可设置是否开启,上传的代码不带这个功能). 5. 支持hover辅助线. 6. 支持多级缩放.鼠标滚轮缩放. 依赖: jquery 1.11 jquer-ui 1.10 jquery-mousewheel 兼容: Chrome.Firefox.IE8(没有圆角和阴影效果) 已知问题: 刻度图片和拖动画布时的鼠标图标可能会失效.原因是这个是写在js里设置的ur…

jquery时间轴幻灯展示源代码

查看效果:http://hovertree.com/texiao/jquery/75/ 源代码下载:http://hovertree.com/h/bjaf/8jlpc2wu.htm 效果图如下: 代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <tit…