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替换字符串的所有示例代码
Jul 23 Javascript
js判断为空Null与字符串为空简写方法
Feb 24 Javascript
javascript版2048小游戏
Mar 18 Javascript
bootstrap3 兼容IE8浏览器!
May 02 Javascript
COM组件中调用JavaScript函数详解及实例
Feb 23 Javascript
Bootstrap Scrollspy源码学习
Mar 02 Javascript
jQuery.cookie.js使用方法及相关参数解释
Mar 06 Javascript
Vue-Cli 3.0 中配置高德地图的两种方式
Jun 19 Javascript
vue响应式更新机制及不使用框架实现简单的数据双向绑定问题
Jun 27 Javascript
layui固定下拉框的显示条数(有滚动条)的方法
Sep 10 Javascript
three.js着色器材质的内置变量示例详解
Aug 16 Javascript
JS实现无限轮播无倒退效果
Sep 21 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语法速查表
2006/12/06 PHP
php 获取mysql数据库信息代码
2009/03/12 PHP
php懒人函数 自动添加数据
2011/06/28 PHP
php上传apk后自动提取apk包信息的使用(示例下载)
2013/04/26 PHP
护卫神php套件 php版本升级方法(php5.5.24)
2015/05/10 PHP
Smarty简单生成表单元素的方法示例
2016/05/23 PHP
PHP十六进制颜色随机生成器功能示例
2017/07/24 PHP
thinkPHP框架实现的简单计算器示例
2018/12/07 PHP
event对象的方法 兼容多浏览器
2009/06/27 Javascript
JavaScript获取function所有参数名的方法
2015/10/30 Javascript
三种AngularJS中获取数据源的方式
2016/02/02 Javascript
Jquery实现$.fn.extend和$.extend函数
2016/04/14 Javascript
jQuery实现图片轮播效果代码
2016/09/27 Javascript
JS作用域深度解析
2016/12/29 Javascript
javascript删除html标签函数cIsHTML
2017/01/09 Javascript
jquery实现折叠菜单效果【推荐】
2017/03/08 Javascript
Node.js环境下Koa2添加travis ci持续集成工具的方法
2017/06/19 Javascript
vue项目部署到Apache服务器中遇到的问题解决
2018/08/24 Javascript
vue-cli 脚手架基于Nightwatch的端到端测试环境的过程
2018/09/30 Javascript
使用webpack构建应用的方法步骤
2019/03/04 Javascript
Python向日志输出中添加上下文信息
2017/05/24 Python
python检测空间储存剩余大小和指定文件夹内存占用的实例
2018/06/11 Python
解决python3.5 正常安装 却不能直接使用Tkinter包的问题
2019/02/22 Python
Django视图扩展类知识点详解
2019/10/25 Python
python飞机大战pygame游戏之敌机出场实现方法详解
2019/12/17 Python
导入tensorflow:ImportError: libcublas.so.9.0 报错
2020/01/06 Python
Jupyter notebook设置背景主题,字体大小及自动补全代码的操作
2020/04/13 Python
python破解同事的压缩包密码
2020/10/14 Python
Python word文本自动化操作实现方法解析
2020/11/05 Python
在C语言中实现抽象数据类型什么方法最好
2014/06/26 面试题
简单英文演讲稿
2014/01/01 职场文书
教师旷工检讨书
2014/01/18 职场文书
大学生个人学习总结
2015/02/15 职场文书
2015国庆节66周年演讲稿
2015/03/20 职场文书
2015年中秋放假通知范文
2015/08/18 职场文书
2016年国陪研修感言
2015/11/18 职场文书