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 相关文章推荐
javascript特殊用法示例介绍
Nov 29 Javascript
jquery计算鼠标和指定元素之间距离的方法
Jun 26 Javascript
Eclipse编辑jsp、js文件时卡死现象的解决办法汇总
Feb 02 Javascript
你不需要jQuery(三) 新AJAX方法fetch()
Jun 14 Javascript
jquery判断对象是否为空并遍历对象的简单实例
Jul 26 Javascript
jquery.rotate.js实现可选抽奖次数和中奖内容的转盘抽奖代码
Aug 23 jQuery
js 毫秒转天时分秒的实例
Nov 17 Javascript
angularJs中$http获取后台数据的实例讲解
Aug 08 Javascript
Vue页面跳转传递参数及接收方式
Sep 09 Javascript
vue实现点击出现操作弹出框的示例
Nov 05 Javascript
Vue +WebSocket + WaveSurferJS 实现H5聊天对话交互的实例
Nov 18 Vue.js
vue3.0中友好使用antdv示例详解
Jan 05 Vue.js
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 cookie 作用范围?不要在当前页面使用你的cookie
2009/03/24 PHP
分享php邮件管理器源码
2016/01/06 PHP
php 流程控制switch的简单实例
2016/06/07 PHP
PHP数字前补0的自带函数sprintf 和number_format的用法(详解)
2017/02/06 PHP
PHP编程实现多维数组按照某个键值排序的方法小结【2种方法】
2017/04/27 PHP
javascript数字数组去重复项的实现代码
2010/12/30 Javascript
如何正确使用javascript 来进行我们的程序开发
2014/06/23 Javascript
AngularJS入门教程(零):引导程序
2014/12/06 Javascript
自己封装的常用javascript函数分享
2015/01/07 Javascript
在JavaScript中如何解决用execCommand(
2015/10/19 Javascript
详解javascript中原始数据类型Null和Undefined
2015/12/17 Javascript
微信小程序中input标签详解及简单实例
2017/05/18 Javascript
vuejs+element-ui+laravel5.4上传文件的示例代码
2017/08/12 Javascript
Vue props 单向数据流的实现
2018/11/06 Javascript
微信小程序实现日历效果
2018/12/28 Javascript
JavaScript实现无限轮播效果
2020/11/19 Javascript
jQuery冲突问题解决方法
2021/01/19 jQuery
[02:36]DOTA2混沌骑士 英雄基础教程
2013/11/26 DOTA
[01:19:33]DOTA2-DPC中国联赛 正赛 iG vs VG BO3 第一场 2月2日
2021/03/11 DOTA
开始着手第一个Django项目
2015/07/15 Python
Python 40行代码实现人脸识别功能
2017/04/02 Python
Python数据类型之Number数字操作实例详解
2019/05/08 Python
python GUI库图形界面开发之PyQt5状态栏控件QStatusBar详细使用方法实例
2020/02/28 Python
Python中的__init__作用是什么
2020/06/09 Python
css3 实现滚动条美化效果的实例代码
2021/01/06 HTML / CSS
《蚕姑娘》教学反思
2014/04/15 职场文书
地质灾害防治方案
2014/05/14 职场文书
党员弘扬焦裕禄精神思想汇报
2014/09/10 职场文书
师德标兵先进事迹材料
2014/12/19 职场文书
《文化苦旅》读后感:阅读,让人诗意地栖居在大地上
2019/12/24 职场文书
《风不能把阳光打败》读后感3篇
2020/01/06 职场文书
基于Python实现的购物商城管理系统
2021/04/27 Python
详解Golang如何优雅的终止一个服务
2022/03/21 Golang
4种方法python批量修改替换列表中元素
2022/04/07 Python
Python代码实现双链表
2022/05/25 Python
在python中读取和写入CSV文件详情
2022/06/28 Python