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 14 Javascript
jQuery CSS()方法改变现有的CSS样式
Aug 20 Javascript
BootStrap glyphicons 字体图标实现方法
May 01 Javascript
AngularJS基础 ng-model 指令详解及示例代码
Aug 02 Javascript
jQuery实现可拖拽的许愿墙效果【附demo源码下载】
Sep 14 Javascript
微信小程序自定义tab实现多层tab嵌套功能
Jun 15 Javascript
微信小程序textarea层级过高的解决方法
Mar 04 Javascript
Vue 自定义指令功能完整实例
Sep 17 Javascript
vue v-for直接循环数字实例
Nov 07 Javascript
详解vue中v-bind:style效果的自定义指令
Jan 21 Javascript
vue循环中点击选中再点击取消(单选)的实现
Sep 10 Javascript
详细分析JavaScript中的深浅拷贝
Sep 17 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 flush()与ob_flush()的区别详解
2013/06/03 PHP
php解压文件代码实现php在线解压
2014/02/13 PHP
php文件上传你必须知道的几点
2015/10/20 PHP
不同的jQuery API来处理不同的浏览器事件
2012/12/09 Javascript
CSS+jQuery实现的一个放大缩小动画效果
2013/09/24 Javascript
Jquery 数组操作大全个人总结
2013/11/13 Javascript
javascript文本框内输入文字倒计数的方法
2015/02/24 Javascript
JavaScript多图片上传案例
2015/09/28 Javascript
javascript实现方法调用与方法触发小结
2016/03/26 Javascript
Node.js+Express配置入门教程详解
2016/05/19 Javascript
jQuery easyUI datagrid 增加求和统计行的实现代码
2016/06/01 Javascript
jQuery得到多个值只能用取Class ,不能用取ID的方法
2016/12/04 Javascript
js倒计时小实例(多次定时)
2016/12/08 Javascript
强大的JavaScript响应式图表Chartist.js的使用
2017/09/13 Javascript
React-Native左右联动List的示例代码
2017/09/21 Javascript
浅谈Node.js CVE-2017-14849 漏洞分析(详细步骤)
2017/11/10 Javascript
CentOS7中源码编译安装NodeJS的完整步骤
2018/10/13 NodeJs
JavaScript中的ES6 Proxy的具体使用
2019/06/16 Javascript
详解python的几种标准输出重定向方式
2016/08/15 Python
selenium+python实现1688网站验证码图片的截取功能
2018/08/14 Python
Python3自动签到 定时任务 判断节假日的实例
2018/11/13 Python
Python使用lambda表达式对字典排序操作示例
2019/07/25 Python
Tensorflow中的dropout的使用方法
2020/03/13 Python
浅谈pymysql查询语句中带有in时传递参数的问题
2020/06/05 Python
python numpy库np.percentile用法说明
2020/06/08 Python
使用K.function()调试keras操作
2020/06/17 Python
文员个人求职自荐信
2013/09/21 职场文书
临床医学大学生求职信
2013/09/28 职场文书
学生的自我鉴定范文
2013/10/24 职场文书
群众路线剖析材料
2014/09/30 职场文书
白鹤梁导游词
2015/02/06 职场文书
优质护理心得体会
2016/01/22 职场文书
2019入党申请书范文3篇
2019/08/21 职场文书
MySQL锁机制
2021/04/05 MySQL
一次线上mongo慢查询问题排查处理记录
2022/03/18 MongoDB
5个pandas调用函数的方法让数据处理更加灵活自如
2022/04/24 Python