Skip to content

eelve/fly

Repository files navigation

fly

前端各种小案例,欢迎体验使用

A human being,who loves football and music.

bootstrap-switch实现的滑块开关。

  • Include the dependencies: jQuery, Bootstrap and Bootstrap Switch CSS + Javascript:
<link href="bootstrap.css" rel="stylesheet">
<link href="bootstrap-switch.css" rel="stylesheet">
<script src="jquery.js"></script>
<script src="bootstrap-switch.js"></script>
  • add your checkbox:
<input type="checkbox" name="my-checkbox" checked>
  • Initialize Bootstrap Switch on it:
$("[name='my-checkbox']").bootstrapSwitch();

更多使用方法请转到:官方

bootstrap-select实现的demo。

如果动态加载的话,需要手动调用$('#select').selectpicker('refresh');

更多使用方法请转到:官方例子

In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery

官方仓库 更多使用方法请转到:官方例子

数据可视化模板,主要利用ECharts实现,另外还可以通过第三方服务来快速实现,如阿里云DataV、腾讯云图、百度Sugar等。本模块包含22个案例。

jquery.searchableSelect实现的下拉搜索组件,修复了change事件:

  selectItem: function(item){
      if(this.hasCurrentSelectedItem())
        this.currentSelectedItem.removeClass('selected');

      this.currentSelectedItem = item;
      item.addClass('selected');

      this.hoverItem(item);

      this.holder.text(item.text());
      var value = item.data('value');
      this.holder.data('value', value);
      this.element.val(value);
      this.element.trigger('change');

      if(this.options.afterSelectItem){
        this.options.afterSelectItem.apply(this);
      }
    }

在源代码的基础上添加了绑定事件,触发change事件

this.element.trigger('change');

动态绑定,手动刷新$('#select').selectpicker('refresh')

success: function (result) {
			var data = eval(result);
			for (let i = 0; i < data.length ; i++) {
						var system = $('#system');
						$("#select").append("<option value='"+data[i].id+"'>"+data[i].name+"</option>");
					}
			$('#select').selectpicker('refresh');			
		}

漂亮优雅的Bootstrap侧边栏导航

动态表格合并案例

JQueryPrint,web页面打印

nicescroll 滚动条插件是一个非常强大的基于 jQuery 的滚动条插件,不需要增加额外的css,几乎全浏览器兼容。ie6+,实现只需要一段代码,侵入性非常小,样式可完全自定义,支持触摸事件,可在触摸屏上使用。

官网地址:http://www.areaaperta.com/nicescroll/

GitHub地址:https://github.com/inuyaksa/jquery.nicescroll

A general-purpose, web standards-based platform for parsing and rendering PDFs.

GitHub地址:https://github.com/mozilla/pdf.js

PDF.js默认情况下不可以打开本地PDF文件(发布后可以打开服务器文件)

PDF.js不可以跨域浏览PDF,特别注意

使用方法可以在viewer.html后面跟上要打开的文件路径或者PDF文件请求地址即可。

尽量使用静态页面,可以执行js,但是不能动态生成dom树

后端接入案例,使用SpringBoot和thymeleaf,欢迎关注,

License

Released under the MIT License.

About

直接起飞的案例,包含各种前端小demo,包括大屏,webpdf,前端打印等等

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published