`

21个css和Ajax表格

阅读更多

http://static.chinavisual.com/storage/contents/2007/11/29/45356T20071129131442_1.shtml

 

 

 

表格对于网页设计师来说再熟悉不过,随着web标准的兴起,表格不再承担架构网页布局的重任。回归到它本来的功能,表现数据。恐怕有很多网页设计师都没有兴趣,我们精选了当今互联网上正在应用的和已经设计好的21个css和Ajax表格,教你一些在表格里用分类和过滤的功能展示信息的有用的技巧。对您在设计网页时起到锦上添花的作用。

  1) Tablecloth
  
  下载地址:http://cssglobe.com/lab/tablecloth/

 

Tablecloth

  2) Create a table like Orbitz’s airline flights 
 
  下载地址:http://www.askthecssguy.com/2007/09/sangeeta_asks_the_css_guy_how_1.html

orbitz

  3) A CSS styled table

  下载地址:http://veerle.duoh.com/blog/comments/a_css_styled_table_version_2/

CSS styled table

 

4) Sortable Table

  下载地址:http://www.phatfusion.net/sortabletable/index.htm

row locking

 

  5) Row Locking with CSS and JavaScript

  下载地址:http://www.askthecssguy.com/2007/05/brett_asks_the_css_guy_if_the.html

row locking




  6) Vertical scrolling tables
  
  下载地址:http://www.cssplay.co.uk/menu/tablescroll.html

Vertical scrolling tables

7) Replicating a Tree table
  
  下载地址:http://www.maxdesign.com.au/presentation/tree-table/

table tree

  8 ) Paginate, sort and search a table with Ajax and Rails

  下载地址:http://dev.nozav.org/rails_ajax_table.html

ajax tables

  9) Collapsible tables with DOM and CSS

  下载地址:http://www.maxdesign.com.au/presentation/tree-table/
  

Collapsible tables

10) TableSorter plug-in for jQuery
  
  下载地址:http://motherrussia.polyester.se/jquery-plugins/tablesorter/

TableSorter


  11) Stripe your tables the OO way

  下载地址:http://www.thewatchmakerproject.com/journal/309/stripe-your-tables-the-oo-way

TableSorter

  12) MOOTOOLS javascript Table Row & Column highlighting

  下载地址:http://www.chrisesler.com/mootools/mootools-rowcolumnhighlight.php

  

mootools
13) CSS Table Gallery
  
  下载地址:http://icant.co.uk/csstablegallery/

css gallery

  14) jQuery Table Filter
  
  下载地址:http://ideamill.synaptrixgroup.com/jquery/tablefilter/tabletest.htm

jquery table filter




  15) Sortable/Resizable/Editable TableKit

  下载地址:http://www.millstream.com.au/upload/code/tablekit/

sortable, resizable, editable

 

16) Make all your tables sortable

  下载地址:http://www.kryogenix.org/code/browser/sorttable/

sortable table

 

  17) Zebra Tables
    
  下载地址:http://www.alistapart.com/articles/zebratables/

sortable table

  18 ) Standardista Table Sorting

  下载地址:http://www.workingwith.me.uk/articles/scripting/standardista_table_sorting

sortable table

 

19) GridView3 Example

  下载地址:http://extjs.com/playpen/ext-2.0/examples/grid/grid3.html

Grid

  20) Mootable
  
  下载地址:http://joomlicious.com/mootable/

MOOTOOLS

  21) Drag & Drop Sortable Lists with JavaScript and CSS
  
  下载地址:http://tool-man.org/examples/sorting.html

drag and drop

分享到:
评论

相关推荐

    21个新奇漂亮的AjaxCSS表格设计

    21个新奇漂亮的AjaxCSS表格设计

    Tablecloth漂亮的Ajax+CSS表格

    Tablecloth 由CSS Globe 开发,是一个轻量级的、易于使用的表格,以友好的方式将样式和行为添加到你当前的HTML 表格元素当中。

    php+mysql+ajax分页+表格table+loading效果+css(已测试成功)

    php+mysql+ajax分页+表格table+loading效果+css(已测试成功)

    js特效脚本含源码和说明Tablecloth漂亮的Ajax+CSS表格

    js特效脚本含源码和说明Tablecloth漂亮的Ajax+CSS表格本资源系百度网盘分享地址

    轻量级Ajax表格组件

    一个简单实用的Ajax表格组件,功能如下: * 是个裸体表格,样式完全开放,利用CSS自己定制。 * 提供增加,删除行的功能。 * 可分页导航,支持动态改变单页最大行数。 * 可页面排序(支持中文拼音排序)。 * 插件...

    php+mysql+ajax分页+表格table+loading效果+css(已测试 成功)

    本文件包含ajaxpg.php, ajax.js, loading.gif, page.css, table.sql 未含任何框架,配置数据库运行即可!! 大家稍稍修改就可以运用在自己的网页系统中!!!

    php+mysql+ajax分页+table+loading效果+css(已测试成功)

    本资料无任何框架,有mysql...文件包含ajaxpg.php,ajax.js,page.css,loading.gif,table.sql; 动态数据显示在table里,有loading效果,page有css样式,可自定义样式,内有注释,大家稍稍修改可添加在个人网页系统中!!

    《精通CSS+DIV网页样式与布局》光盘源码

     6.3 表格实例二:鼠标经过时变色的表格   6.4 表格实例三:日历   6.5 CSS与表单   6.6 综合实例一:直接输入的Excel表格   6.7 综合实例二:模仿新浪网民调查问卷   第7章 用CSS设置页面和浏览器...

    精通CSS+DIV样式和布局详细源码

    本书还详细讲解了其他书中较少涉及的技术细节,包括扩展CSS与JavaScript、XML和Ajax的综合应用等内容,指导读者制作符合Web标准的网页,使从事或欲从事网站设计开发专业工作的读者提升技术水平和竞争能力。...

    精通CSS+DIV网页样式与布局视频教材

    6.3 表格实例二:鼠标经过时变色的表格 6.4 表格实例三:日历 6.5 CSS与表单 6.5.1 表单中的元素 6.5.2 像文字一样的按钮 6.5.3 七彩的下拉菜单 6.6 综合实例一:直接输入的Excel表格 6.7 ...

    精通CSS.DIV.网页样式与布局 源码

     6.3 表格实例二:鼠标经过时变色的表格   6.4 表格实例三:日历   6.5 CSS与表单   6.6 综合实例一:直接输入的Excel表格   6.7 综合实例二:模仿新浪网民调查问卷   第7章 用CSS设置页面和...

    精通CSS+DIV网页样式与布局

     6.3 表格实例二:鼠标经过时变色的表格   6.4 表格实例三:日历   6.5 CSS与表单   6.6 综合实例一:直接输入的Excel表格   6.7 综合实例二:模仿新浪网民调查问卷   第7章 用CSS设置页面和浏览器...

    [精通CSS.DIV.网页样式与布局].(前沿科技).扫描版

    本书系统地讲解了CSS层迭样式表的基础理论和实际运用技术,通过大量实例对CSS进行深入浅出的分析,主要包括CSS的基本语法和概念,设置文字、图片、背景、表格、表单和菜单等网页元素的方法,以及CSS滤镜的使用。...

    精通CSS.DIV.网页样式与布局

    第6章 用css设置表格与表单的样式 第7章 用css设置页面和浏览器的元素 第8章 用css制作实用的菜单 第9章 css滤镜的应用 第2部分 css+div美化和布局篇 第10章 理解css定位与div布局 第11章 css+div布局方法剖析 第12...

    精通CSS+DIV网页样式与布局Part1

     6.3 表格实例二:鼠标经过时变色的表格   6.4 表格实例三:日历   6.5 CSS与表单   6.6 综合实例一:直接输入的Excel表格   6.7 综合实例二:模仿新浪网民调查问卷   第7章 用CSS设置页面和浏览器...

    精通CSS.DIV网页样式与布局视频01

     6.3 表格实例二:鼠标经过时变色的表格   6.4 表格实例三:日历   6.5 CSS与表单   6.6 综合实例一:直接输入的Excel表格   6.7 综合实例二:模仿新浪网民调查问卷   第7章 用CSS设置页面和浏览器...

    AJAX基础概念、核心技术与典型案例(内涵动态实例)

    程序描述:本章模仿Google ig,使用Ajax技术实现一个个性化主页系统。通过拖拽方式设置主页,当完成拖拽窗口时,自动保存布局,使用户可以随时根据喜好来设置布局。 /login.jsp 登录页面 /homepage.jsp ...

    CSS.DIV样式与布局(笔记)

    CSS概念\CSS基本语法\CSS文字效果\CSS图片效果\CSS页面背景\CSS设置表格和表单样式\页面和浏览器元素\CSS制作实用菜单\CSS滤镜\理解DIV与CSS定位\CSS排版\网页变幻\CSS与JAVASCRIPT\CSS与XML的综合应用\CSS与AJAX的...

Global site tag (gtag.js) - Google Analytics