zoukankan      html  css  js  c++  java
  • 弹出窗

    <!--[if IE 6]>
    <script>
    	var isIE6 = true;
    </script>
    <style>
    * html { background-image:url(about:blank); background-attachment:fixed; }
    * html .mask_content { z-index: 9999; position: absolute; left: expression(eval(document.documentElement.scrollLeft + document.documentElement.clientWidth/2 - this.offsetWidth/2));top: expression(eval(document.documentElement.scrollTop + document.documentElement.clientHeight/2 - this.offsetHeight/2)); }
    </style>
    <![endif]-->
    <script>
    	//通用弹层
    	function openLay(options) {
    		var content_html_code = typeof options.content_html_code === 'undefined' ? '' : options.content_html_code,
    			content_height = typeof options.height === 'undefined' ? 300 : options.height,
    			content_width = typeof options.width === 'undefined' ? 400 : options.width;
    						
    		var docE = document.documentElement,
    			mask = $('<div class="mask"/>').css({position:'absolute','z-index':999,left:'0',top:'0',opacity:'.8',filter:'alpha(opacity=80)','background-color':'#000'}),
    			iframe = $('<iframe />').css({position:'absolute','100%',height:'100%','z-index':-1,top:0,left:0,filter:'alpha(opacity=0)'}),
    			content = $('<div class="mask_content">' + content_html_code  + '<em id="mask_close" style="position:absolute;top: 0;right:5px;font-size:24px;font-weight:bold;font-style:normal;color:#f60;cursor:pointer;40px;height:40px;background:url(about:blank)"></em></div'),
    			
    			//		content = $('<div class="mask_content">' + content_html_code  + '<em id="mask_close" style="position:absolute;top: 0;right:5px;font-size:24px;font-weight:bold;font-style:normal;color:#f60;cursor:pointer;">×</em></div'),
    			dom_content = content[0],
    			dom_mask = mask[0];		
    		
    		mask.width(Math.max(document.body.scrollWidth,docE.scrollWidth)).height(Math.max(document.body.scrollHeight,docE.scrollHeight));
    		if (typeof isIE6 !== 'boolean') {
    			content.css({position:'fixed','z-index':9999,content_width,height:content_height,left:'50%',top:'50%','margin-left':-options.width/2,'margin-top':-options.height/2});
    		}
    		
    		dom_mask.appendChild(iframe[0]);
    		document.body.appendChild(dom_mask);
    		document.body.appendChild(dom_content);
    		
    		$('#mask_close').click(function(){
    			$('.mask_content').fadeOut(500);
    			$('.mask').remove();
    			$('.mask_content').remove();			
    		})	
    	}	
    	
    
    	$(function(){
    		
    		$("#tip1btn").click(function(){
    			openLay({427,height:278,content_html_code:'<img src="http://img04.taobaocdn.com/tps/i4/T16lGyXX8PXXXXXXXX-427-278.gif"/>'});
    			})
    			
    		$("#tip2btn").click(function(){
    			openLay({427,height:289,content_html_code:'<img src="http://img01.taobaocdn.com/tps/i1/T1clSyXmVOXXXXXXXX-427-289.gif"/>'});
    			})
    		$("#tip3btn").click(function(){
    			openLay({427,height:312,content_html_code:'<img src="http://img02.taobaocdn.com/tps/i2/T1gRSyXmxOXXXXXXXX-427-312.gif"/>'});
    			})
    		})
    </script>
    
     <script type="text/javascript">
               function fun_share(title, content) {
    			var _url = "http://v.t.sina.com.cn/share/share.php?content=utf-8&title="+content+"&url="+encodeURIComponent(location.href);
    			   openLay({425,height:241,content_html_code:'<a style="text-decoration:none" href="javascript:window.open("'+_url +'")" tearget="_blank"><div style="background:url(http://img02.taobaocdn.com/tps/i2/T1PCOyXhFJXXXXXXXX-425-241.gif) no-repeat;425px;height:186px;padding-top:55px;"><p style="color:#7f1fac;font-size:15px;text-align:center;425px;height:30px;">'+title+'</p><p style="font-size:12px;color:#000;327px;padding:0 49px; text-indent:20px;line-height:1.6">'+content+'</p></div></a>'});
                  return "ok";
               }
            </script>
    

      

    编辑器加载中...

  • 相关阅读:
    进程间通信:命名管道FIFO(2)
    进程间通信:管道(1)
    POSIX线程学习
    进程与信号学习
    堆栈的区别与联系
    浅读《构建之法:现代软件工程》有感
    CSS学习成长记
    jquery学习成长记(一)
    html学习成长记
    Razor视图
  • 原文地址:https://www.cnblogs.com/jinbiao/p/2243491.html
Copyright © 2011-2022 走看看