jQuery支持添加事件的日历特效代码分享(3种样式)


Posted in Javascript onAugust 24, 2015

支持添加事件jQuery日历是一款可以实时添加删除时间的jquery日历插件代码,感兴趣的朋友快来学习学习吧
运行效果图:----------------------查看效果 下载源码-----------------------

jQuery支持添加事件的日历特效代码分享(3种样式)

小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式。
为大家分享的jQuery支持添加事件的日历特效代码如下

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>支持添加事件jQuery日历</title>
<link rel="stylesheet" href="style/documentation.css" type="text/css" />
<link rel="stylesheet" href="style/jalendar.css" type="text/css" />
<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script><!--jQuery-->
<script type="text/javascript" src="js/jalendar.js"></script>
<script type="text/javascript">
$(function () {
 $('#myId').jalendar({
 customDay: '2017/12/01', // Format: Year/Month/Day
 color: '#ed145a', // Unlimited Colors
 lang: 'EN' // Format: English — 'EN', Türkçe — 'TR'
 });
 $('#myId2').jalendar({
 customDay: '2016/02/29',
 color: '#023447',
 lang: 'ES'
 });
 $('#myId3').jalendar();
});
</script>

</head>

<body>
 
<article>

 <div id="myId" class="jalendar">
 <div class="added-event" data-date="14/12/2017" data-time="Tüm Gün" data-title="WWDC 13 on San Francisco, LA"></div>
 <div class="added-event" data-date="16/12/2017" data-time="20:45" data-title="Tarkan İstanbul Concert on Harbiye Açık Hava Tiyatrosu"></div>
 <div class="added-event" data-date="17/12/2017" data-time="21:00" data-title="CodeCanyon İstanbul Meeting on Starbucks, Kadıköy"></div>
 <div class="added-event" data-date="17/12/2017" data-time="22:00" data-title="Front-End Design and Javascript Conferance on Haliç Kongre Merkezi"></div>
 <div class="added-event" data-date="17/12/2017" data-time="22:00" data-title="Lorem ipsum dolor sit amet"></div>
 </div>

<div id="myId2" class="jalendar"></div>
 
<div id="myId3" class="jalendar mid">
 <div class="added-event" data-date="9/8/2013" data-time="Tüm Gün" data-title="WWDC 13 on San Francisco, LA"></div>
 <div class="added-event" data-date="16/8/2013" data-time="20:45" data-title="Tarkan İstanbul Concert on Harbiye Açık Hava Tiyatrosu"></div>
 <div class="added-event" data-date="17/8/2013" data-time="21:00" data-title="CodeCanyon İstanbul Meeting on Starbucks, Kadıköy"></div>
 <div class="added-event" data-date="17/8/2013" data-time="22:00" data-title="Front-End Design and Javascript Conferance on Haliç Kongre Merkezi"></div>
 <div class="added-event" data-date="17/12/2017" data-time="22:00" data-title="Lorem ipsum dolor sit amet"></div>
</div>
</article>
<div style="text-align:center;clear:both">
</div>
</body>
</html>

以上就是为大家分享的jQuery支持添加事件的日历特效代码,希望大家可以喜欢。

Javascript 相关文章推荐
js打开新窗口方法整理
Feb 17 Javascript
jQuery实现渐变下拉菜单的简单方法
Mar 11 Javascript
AngularJS自动表单验证
Feb 01 Javascript
javascript实现随机生成DIV背景色
Jun 20 Javascript
Bootstrap实现弹性搜索框
Jul 11 Javascript
Bootstrap组件之下拉菜单,多级菜单及按钮布局方法实例
May 25 Javascript
JavaScript ES6中const、let与var的对比详解
Jun 18 Javascript
详解如何实现Element树形控件Tree在懒加载模式下的动态更新
Apr 25 Javascript
初试vue-cli使用HBuilderx打包app的坑
Jul 17 Javascript
小程序的上传文件接口的注意要点解析
Sep 17 Javascript
JavaScript原型继承和原型链原理详解
Feb 04 Javascript
javascript实现简易数码时钟
Mar 30 Javascript
jQuery实现的多级下拉菜单效果代码
Aug 24 #Javascript
js贪吃蛇网页版游戏特效代码分享(挑战十关)
Aug 24 #Javascript
jquery马赛克拼接翻转效果代码分享
Aug 24 #Javascript
jquery+CSS实现的水平布局多级网页菜单效果
Aug 24 #Javascript
jQuery实现的背景动态变化导航菜单效果
Aug 24 #Javascript
jquery带下拉菜单和焦点图代码分享
Aug 24 #Javascript
javascript中SetInterval与setTimeout的定时器用法
Aug 24 #Javascript
You might like
php自定义hash函数实例
2015/05/05 PHP
PHP中Session可能会引起并发问题
2015/06/26 PHP
PHP去除字符串最后一个字符的三种方法实例
2017/03/01 PHP
Laravel Eloquent分表方法并使用模型关联的实现
2019/11/25 PHP
php 下 html5 XHR2 + FormData + File API 上传文件操作实例分析
2020/02/28 PHP
在IE上直接编辑网页内容的js代码(IE地址栏js)
2009/04/27 Javascript
纯JS实现五子棋游戏兼容各浏览器(附源码)
2013/04/24 Javascript
在每个匹配元素的外部插入新元素的方法
2013/12/20 Javascript
使用Chrome浏览器调试AngularJS应用的方法
2015/06/18 Javascript
浅谈jquery中delegate()与live()
2015/06/22 Javascript
JS中递归函数
2016/06/17 Javascript
jquery 点击元素后,滚动条滚动至该元素位置的方法
2016/08/05 Javascript
浅谈Angular的$q, defer, promise
2016/12/20 Javascript
JS实现的简易拖放效果示例
2016/12/29 Javascript
超全面的vue.js使用总结
2017/02/12 Javascript
jQuery设置图片等比例缩小的方法
2017/04/29 jQuery
react开发教程之React 组件之间的通信方式
2017/08/12 Javascript
浅谈js基础数据类型和引用类型,深浅拷贝问题,以及内存分配问题
2017/09/02 Javascript
vue微信分享 vue实现当前页面分享其他页面
2017/12/02 Javascript
简单说说如何使用vue-router插件的方法
2019/04/08 Javascript
JS动态图片的实现方法完整示例
2020/01/13 Javascript
js防抖函数和节流函数使用场景和实现区别示例分析
2020/04/11 Javascript
python检查指定文件是否存在的方法
2015/07/06 Python
Python嵌套函数,作用域与偏函数用法实例分析
2019/12/26 Python
部署Django到阿里云服务器教程示例
2020/06/03 Python
Python基于正则表达式实现计算器功能
2020/07/13 Python
numpy中生成随机数的几种常用函数(小结)
2020/08/18 Python
Python爬取微信小程序Charles实现过程图解
2020/09/29 Python
深入浅出CSS3 background-clip,background-origin和border-image教程
2011/01/27 HTML / CSS
装修致歉信
2014/01/15 职场文书
情况说明书格式范文
2014/05/06 职场文书
学校交通安全责任书
2014/08/25 职场文书
2014年电厂个人工作总结
2014/11/27 职场文书
商超业务员岗位职责
2015/02/13 职场文书
Go 自定义package包设置与导入操作
2021/05/06 Golang
GO语言字符串处理函数之处理Strings包
2022/04/14 Golang