• ArtDialog V6的简单使用


    artDialog v6 —— 经典的网页对话框组件,内外皆用心雕琢。

    兼容性

    測试通过:IE6~IE11、Chrome、Firefox、Safari、Opera

    授权协议

    免费,且开源。基于LGPL协议。

    支持开源

    贡献代码 || 捐赠一杯咖啡 || 商业授权

    artDialog,献给那些愿意为 web 极致体验付出的人们!


    四年来。有超过 40 万站点在使用 artDialog,当中不乏国内顶尖的产品:

    在artDialog的使用中,使用较多版本号为4.1.7和6了,曾经我都是使用4.1.7版本号,所以来研究了一下v6版本号的使用。直接上代码:

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    <%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
    %>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <base href="<%=basePath%>">
        
        <title>ArtDialog V6</title>
    	<meta http-equiv="pragma" content="no-cache">
    	<meta http-equiv="cache-control" content="no-cache">
    	<meta http-equiv="expires" content="0">    
    	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    	<meta http-equiv="description" content="This is my page">
    	<!--
    	<link rel="stylesheet" type="text/css" href="styles.css">
    	-->
    	
    	
    	<link rel="stylesheet" type="text/css" href="artDialog/css/ui-dialog.css">
    	
    	<script type="text/javascript" src="jquery/jquery-1.8.3.min.js"></script>
    	<script type="text/javascript" src="artDialog/js/dialog-min.js"></script>
    	
    	<script type="text/javascript">
    		function test1(){
    			var d = dialog({
    				title:'欢迎',
    	   			content:'欢迎使用 artDialog v6对话框组件。'
    			});
    			d.show();
    		}
    		
    		function test2(){
    			var d = dialog({
    				title:'欢迎',
    	   			content:'欢迎使用 artDialog v6对话框组件!

    ' }); d.showModal(); } function test3(obj){ var d = dialog({ content: 'Hello World!', quickClose: true// 点击空白处高速关闭 }); d.show(obj); } function test4(){ var d = dialog({ title: '欢迎', content: '欢迎使用 artDialog 对话框组件!

    ', ok: function () {}, statusbar: '<label><input type="checkbox">不再提醒</label>' }); d.show(); } function test5(){ dialog({ button:[{ value: '允许', callback: function () { this .content('你允许了'); return false; }, autofocus: true },{ value: '不允许', callback: function () { alert('你不允许') } },{ id: 'button-disabled', value: '无效按钮', disabled: true },{ value: '关闭我' }] }).show(); } </script> </head> <body> <input type="button" value="普通对话框" onclick="javascript:test1();"> <input type="button" value="模态对话框" onclick="javascript:test2();"> <input type="button" value="气泡浮层" onclick="javascript:test3(this);"> <input type="button" value="statusbar" onclick="javascript:test4();"> <input type="button" value="自己定义按钮组" onclick="javascript:test5();"> </body> </html>


    有不懂,想要其它效果的能够去看看API,一切就都能够轻松搞定了

  • 相关阅读:
    Java中使用JTS对空间几何计算(读取WKT、距离、点在面内、长度、面积、相交等)
    Java中Thread类的常用API以及使用示例
    Vue+Leaflet.PM+Turf.js实现绘制多线段并自动生成辐射区(缓冲区)
    SpringBoot中使用Redisson分布式锁的应用场景多线程、服务、节点秒杀/抢票处理
    Turf.js(地理空间GIS分析的js库),处理地图相关算法
    Java中使用CountDownLatch实现并发流程控制
    Java中数据同步synchronized关键字与Mointor的使用
    SpringBoot+Lombok+Builder实现任意个数属性的对象构造
    【20220930】连岳摘抄
    【20220928】按自己节奏走
  • 原文地址:https://www.cnblogs.com/zsychanpin/p/6927082.html
Copyright © 2020-2023  润新知