jQuery 弹窗的问题

2010-01-08 11:30:20 320 阅读 AI 写同款 · GEO 优化AI 选题数据监测一键分发 ›

chl19871024 墨衍会员 · AI 创作全网分发关注 + 加入社区

【AI智能体】Coze 搭建个人旅游规划助手实战详解本文将详细介绍如何使用Coze平台搭建个人旅游规划助手。首先概述了AI智能体如何简化传统复杂任务的开发流程，然后重点介绍了Coze工作流的作用和核心节点类型（包括大模型、插件、知识库等）。通过实际操作演示，从创建智能体到配置多级工作流，逐步实现旅游规划功能：解析用户输入时间地点、查询必玩景点、获取景点详细信息等。该教程展示了如何利用Coze的可视化编排能力，即使非技术人员也能快速构建专业级AI应用。最终呈现的旅游助手可提供天气查询、行程建议等一站式服务。阅读详情

我用了个jQuery弹窗但是我的网页嵌套这iframe页面所以它只能出来这个效果

但是我想让它全部遮盖住不知道怎么弄（而且这个例子是可以拖动的但是在IE里不能拖动在火狐里就可以）

...全文

电力电子论文（TPE、TTE）投稿经验分享电力电子顶刊论文投稿经验阅读详情

chl19871024

JavaScript 87,984 成员 224,681 内容

+ 关注 + 加入社区

切换为时间正序

chl19871024 2010-01-12

打赏
举报

[Quote=引用 10 楼 happy002 的回复:]
JScript codeif ( _version==6.0 ) {
$("#windown-box").css({left:"50%",top:(parseInt((ch)/2)+est)+"px",marginTop: -((parseInt(height)+53)/2)+"px",marginLeft:-((parseInt(width)+32)/2)+"px",zIndex: "999999"}); }else {
$("#windown-box").css({left:"50%",top:"50%",marginTop:-((parseInt(height)+53)/2)+"px",marginLeft:-((parseInt(width)+32)/2)+"px",zIndex:"999999"});
};

是这两句不？你可以尝试改一下left，试试。
如果不是就找下一个left，应该是由这个控制左右的，top控制上下
[/Quote]

你那段代码是控制移动的不是控制遮盖的。

chl19871024 2010-01-08

打赏
举报



$(function(){

	document.parent.$("#iframe1").click(function(){

		tipsWindown("添加企业名片","iframe:http://www.qq.com","700","400","true","","true","");

	});

 });



///-------------------------------------------------------------------------

//jQuery弹出窗口 By Await [2009-11-22]

//--------------------------------------------------------------------------

/*参数：[可选参数在调用时可写可不写,其他为必写]

----------------------------------------------------------------------------

    title:	窗口标题

  content:  内容(可选内容为){ text | id | img | url | iframe }

    width:	内容宽度

   height:	内容高度

	 drag:  是否可以拖动(ture为是,false为否)

     time:	自动关闭等待的时间，为空是则不自动关闭

   showbg:	[可选参数]设置是否显示遮罩层(0为不显示,1为显示)

  cssName:  [可选参数]附加class名称

 ------------------------------------------------------------------------*/

 //示例:

 //------------------------------------------------------------------------

 //simpleWindown("例子","text:例子","500","400","true","3000","0","exa")

 //------------------------------------------------------------------------

var showWindown = true;

var templateSrc = "http://leotheme.cn/wp-content/themes/Dreamy"; //设置loading.gif路径



function tipsWindown(title,content,width,height,drag,time,showbg,cssName) {

	$("#windown-box").remove(); //请除内容

	var width = width>= 950?this.width=950:this.width=width;	    //设置最大窗口宽度

	var height = height>= 527?this.height=527:this.height=height;  //设置最大窗口高度

	if(showWindown == true) {

		var simpleWindown_html = new String;

			simpleWindown_html = "<div id=\"windownbg\" style=\"height:"+$(document).height()+"px;filter:alpha(opacity=0);opacity:0;z-index: 999901\"></div>";

			simpleWindown_html += "<div id=\"windown-box\">";

			simpleWindown_html += "<div id=\"windown-title\"><h2></h2><span id=\"windown-close\">关闭</span></div>";

			simpleWindown_html += "<div id=\"windown-content-border\"><div id=\"windown-content\"></div></div>"; 

			simpleWindown_html += "</div>";

			$("body").append(simpleWindown_html);

			show = false;

	}

	contentType = content.substring(0,content.indexOf(":"));

	content = content.substring(content.indexOf(":")+1,content.length);

	switch(contentType) {

		case "text":

		$("#windown-content").html(content);

		break;

		case "id":

		$("#windown-content").html($("#"+content+"").html());

		break;

		case "img":

		$("#windown-content").ajaxStart(function() {

			$(this).html("<img src='"+templateSrc+"' class='loading' />");

		});

		$.ajax({

			error:function(){

				$("#windown-content").html("<p class='windown-error'>加载数据出错...</p>");

			},

			success:function(html){

				$("#windown-content").html("<img src="+content+" alt='' />");

			}

		});

		break;

		case "url":

		var content_array=content.split("?");

		$("#windown-content").ajaxStart(function(){

			$(this).html("<img src='"+templateSrc+"' class='loading' />");

		});

		$.ajax({

			type:content_array[0],

			url:content_array[1],

			data:content_array[2],

			error:function(){

				$("#windown-content").html("<p class='windown-error' style='color:#FF0000'>加载数据出错...</p>");

			},

			success:function(html){

				$("#windown-content").html(html);

			}

		});

		break;

		case "iframe":

		$("#windown-content").ajaxStart(function(){

			$(this).html("<img src='"+templateSrc+"' class='loading' />");

		});

		$.ajax({

			error:function(){

				$("#windown-content").html("<p class='windown-error'>加载数据出错...</p>");

			},

			success:function(html){

				$("#windown-content").html("<iframe src=\""+content+"\" width=\"100%\" height=\""+parseInt(height)+"px"+"\" scrolling=\"auto\" frameborder=\"0\" marginheight=\"0\" marginwidth=\"0\"></iframe>");

			}

		});

	}

	$("#windown-title h2").html(title);

	if(showbg == "true") {$("#windownbg").show();}else {$("#windownbg").remove();};

	$("#windownbg").animate({opacity:"0.5"},"normal");//设置透明度

	$("#windown-box").show();

	if( height >= 527 ) {

		$("#windown-title").css({width:(parseInt(width)+22)+"px"});

		$("#windown-content").css({width:(parseInt(width)+17)+"px",height:height+"px"});

	}else {

		$("#windown-title").css({width:(parseInt(width)+10)+"px"});

		$("#windown-content").css({width:width+"px",height:height+"px"});

	}

	var	cw = document.documentElement.clientWidth,ch = document.documentElement.clientHeight,est = document.documentElement.scrollTop; 

	var _version = $.browser.version;

	if ( _version == 6.0 ) {

		$("#windown-box").css({left:"50%",top:(parseInt((ch)/2)+est)+"px",marginTop: -((parseInt(height)+53)/2)+"px",marginLeft:-((parseInt(width)+32)/2)+"px",zIndex: "999999"});

	}else {

		$("#windown-box").css({left:"50%",top:"50%",marginTop:-((parseInt(height)+53)/2)+"px",marginLeft:-((parseInt(width)+32)/2)+"px",zIndex: "999999"});

	};

	var Drag_ID = document.getElementById("windown-box"),DragHead = document.getElementById("windown-title");

		

	var moveX = 0,moveY = 0,moveTop,moveLeft = 0,moveable = false;

		if ( _version == 6.0 ) {

			moveTop = est;

		}else {

			moveTop = 0;

		}

	var	sw = Drag_ID.scrollWidth,sh = Drag_ID.scrollHeight;

		DragHead.onmouseover = function(e) {

			if(drag == "true"){DragHead.style.cursor = "move";}else{DragHead.style.cursor = "default";}

		};

		DragHead.onmousedown = function(e) {

		if(drag == "true"){moveable = true;}else{moveable = false;}

		e = window.event?window.event:e;

		var ol = Drag_ID.offsetLeft, ot = Drag_ID.offsetTop-moveTop;

		moveX = e.clientX-ol;

		moveY = e.clientY-ot;

		document.onmousemove = function(e) {

				if (moveable) {

				e = window.event?window.event:e;

				var x = e.clientX - moveX;

				var y = e.clientY - moveY;

					if ( x > 0 &&( x + sw < cw) && y > 0 && (y + sh < ch) ) {

						Drag_ID.style.left = x + "px";

						Drag_ID.style.top = parseInt(y+moveTop) + "px";

						Drag_ID.style.margin = "auto";

						}

					}

				}

		document.onmouseup = function () {moveable = false;};

		Drag_ID.onselectstart = function(e){return false;}

	}

	

	$("#windown-content").attr("class","windown-"+cssName);

	

	

	

	

	

	

	

	

	

	var closeWindown = function() {

		$("#windownbg").remove();

		$("#windown-box").fadeOut("slow",function(){$(this).remove();});

	}

	if( time == "" || typeof(time) == "undefined") {

		$("#windown-close").click(function() {

			$("#windownbg").remove();

			$("#windown-box").fadeOut("slow",function(){$(this).remove();});

		});

	}else { 

		setTimeout(closeWindown,time);

	}

		}

附上 JS源码

Becky2oo8 2010-01-08

打赏
举报

LZ贴图上的数据是真实的么？建议以后小心，你公开别人的隐私啦！

happy002 2010-01-08

打赏
举报

if ( _version == 6.0 ) {

        $("#windown-box").css({left:"50%",top:(parseInt((ch)/2)+est)+"px",marginTop: -((parseInt(height)+53)/2)+"px",marginLeft:-((parseInt(width)+32)/2)+"px",zIndex: "999999"});

    }else {

        $("#windown-box").css({left:"50%",top:"50%",marginTop:-((parseInt(height)+53)/2)+"px",marginLeft:-((parseInt(width)+32)/2)+"px",zIndex: "999999"});

    };

是这两句不？你可以尝试改一下left，试试。
如果不是就找下一个left，应该是由这个控制左右的，top控制上下

chl19871024 2010-01-08

打赏
举报

谁能给个具体方法啊。。

chl19871024 2010-01-08

打赏
举报

[Quote=引用 5 楼 ltnrain 的回复:]
找到添加遮罩层的代码。。
[/Quote]
刚学习所以不会修改。。。

chl19871024 2010-01-08

打赏
举报

[Quote=引用 6 楼 happy002 的回复:]
设置一下弹窗位置，left和top ,

拖动问题，应该是代码不兼容。看一下w3c标准
[/Quote]
问题就是不知道在哪里设置了。。

happy002 2010-01-08

打赏
举报

设置一下弹窗位置，left和top ,

拖动问题，应该是代码不兼容。看一下w3c标准

草根醉秋意 2010-01-08

打赏
举报

找到添加遮罩层的代码。。

草根醉秋意 2010-01-08

打赏
举报





if(showWindown == true) {

        var simpleWindown_html = new String;

            simpleWindown_html = "<div id=\"windownbg\" style=\"height:"+$(document).height()+"px;filter:alpha(opacity=0);opacity:0;z-index: 999901\"></div>";

            simpleWindown_html += "<div id=\"windown-box\">";

            simpleWindown_html += "<div id=\"windown-title\"><h2></h2><span id=\"windown-close\">关闭</span></div>";

            simpleWindown_html += "<div id=\"windown-content-border\"><div id=\"windown-content\"></div></div>"; 

            simpleWindown_html += "</div>";

            $("body").append(simpleWindown_html);

            show = false;

    }

上面这段代码是加遮罩的。
楼主按照下面这个思路去修改下看看



//获取顶级的window对象

var topWindow = window.parent;



    while (topWindow.parent && topWindow.parent != topWindow) {

        try {

            if (topWindow.parent.document.domain != document.domain)

                break;

            if (topWindow.parent.document.getElementsByTagName('frameset').length > 0)

                break;

        }

        catch (e) {

            break;

        }

        topWindow = topWindow.parent;

    }



    var topDocument = topWindow.document;

//把遮罩层添加到顶级的文档中

$(topDocument.body).append(simpleWindown_html);

chl19871024 2010-01-08

打赏
举报

我在IE8内不能拖动。。
怎么解决遮盖这个问题呢！

lioncin 2010-01-08

打赏
举报

不能拖动，可能是IE版本问题，IE8是兼容的

jQuery 弹窗的问题

相关推荐