其实现代浏览器大多都支持文本框尺寸调节功能,绝大多数情况下却没有自动适应来得爽快,在网络上发现一方法比较简单的实现文本框高度自适应,于是封装了这个函数,准备以后应用到项目中。 源代码: 23:03文章更新: 感谢alucelx同学再次给力的帮助,大大简化了方法,更新代码为0.2版本,同时解决了兼容Opera浏览器,至此全兼容IE6+与现代浏览器! 在线演示: http://demo.jb51.net/js/2011/autoArea/index.htmautoTextarea.js 代码...
直接上代码: 方案一: 枫芸志 » 文本框textarea高度自适应增长/伸缩 textarea { height:100px; width: 300px; } 晴枫制作 http://jb51.net // 最小高度 var minHeight = 100; // 最大高度,超过则出现滚动条 var maxHeight = 300; function ResizeTextarea(){ var t = document.getElementById('txtContent'); h = t.scrollHeight; h = h > minHeight ? h : minHeight; h = h > maxHeight ? maxHeight : h; t.st...
JS部分具体的代码如下: 代码如下:var getSiblingNode=function(className,elAr,el,not){ className=" "+className+" "; var Arr=[]; for(var i=0,l=elAr.length;i<l;i++){ if(elAr[i]!=el&&(elAr[i].nodeType===1)&&(" "+elAr[i].className+" ").indexOf(className)>-1&& not){ Arr.push(elAr[i]); } else if(elAr[i]!=el&&elAr[i].nodeType===1){ Arr.push(elAr[i]); } } return Arr; } var runFn=function(id,parentId){ var e...
为了防止图片撑破布局,最常见的仍然是通过onload后获取图片尺寸再进行调整,所以加载过程中仍然会撑破。而Qzone日志的图片在此进行了改进,onload完毕后才显示原图。我以前用onload写过一个小例子:http://www.planeart.cn/?p=1022 通过imgReady可以跨浏览器在dom ready就可以实现图片自适应,无需等待img加载,代码如下: 代码如下:// jQuery.autoIMG.js v0.2 // Tang Bin - http://planeArt.cn/ - MIT Licensed (function ($) ...
代码如下:<script type="text/javascript"> function reinitIframe(){ var iframe = document.getElementById("mainFrame"); try{ var bHeight = iframe.contentWindow.document.body.scrollHeight; var dHeight = iframe.contentWindow.document.documentElement.scrollHeight; var height = Math.max(bHeight, dHeight); iframe.height = height; }catch (ex){} } window.setInterval("reinitIframe()", 200); </script>
首先是Jquery 无标题文档 $(function(){ var scrtime; $("#con").hover(function(){ clearInterval(scrtime); },function(){ scrtime = setInterval(function(){ var $ul = $("#con ul"); var liHeight = $ul.find("li:last").height(); $ul.animate({marginTop : liHeight+40 +"px"},1000,function(){ $ul.find("li:last").prependTo($ul) $ul.find("li:first").hide(); $ul.css({marginTop:0}); $ul.find("li:first")....
jquery很强大,代码很简单: 代码如下:$("#iPersonalInfo").load(function() { $(this).height($(this).contents().height()); }) 有一点需要注意的,我也在调试的时候才发现的,耽误了不少时间。就是绑定事件必须在iframe加载完毕之前绑定,否则不会执行。 以下是jQuery,load事件的概述 在每一个匹配元素的load事件中绑定一个处理函数。 如果绑定给window对象,则会在所有内容加载后触发,包括窗口,框架,对象和图像。如果绑定...
Introduction 1. This textarea is like the google calendar's description when you create one new or update one existence calendar; 2. Its height will be changed accroding to user's input; 3. Its scrollbar is removed, which makes it much user friendly. I guess you may like it. Using the code 1. import the jquery.js and textarea.js <script language="javascript" type="text/javascript" src="js/jquery.m...
废话不多说,贴上代码,也算是自己的一个代码存储。 代码如下:var temp_iframe var content = document.getElementById(right); //id为 right的DOM容器中,进行创建iframe和宽高自适应 var c = 0; function append(filename) { var the_iframe = "helpfile" + c; temp_iframe = document.createElement("iframe"); temp_iframe.src = filename; temp_iframe.scrolling = "no"; temp_iframe.setAttribute("frameborder", "0"); tem...
代码如下:<body onload="javascript: setHeight();"> <script> function setHeight(){ var dHeight = document.documentElement.scrollHeight; var t = document.createElement("div"); t.innerHTML = <iframe id="kxiframeagent" src="http://rest.kaixin001.com/api/agent.html#+dHeight+"scrolling="yes" height="0px" width="0px"></iframe>; document.documentElement.appendChild(t.firstChild); } </script> 我想着跨域如何...
页面域关系: 主页面a.html所属域A:www.gxlcms.com 被iframe的页面b.html所属域B:www.baidu.com,假设地址:http://www.baidu.com/b.html 实现效果: A域名下的页面a.html中通过iframe嵌入B域名下的页面b.html,由于b.html的宽度和高度是不可预知而且会变化的,所以需要a.html中的iframe自适应大小. 问题本质: js对跨域iframe访问问题,因为要控制a.html中iframe的高度和宽度就必须首先读取得到b.html的大小,A、B不属于同一个域,浏览...
关键字“拖曳搜索”之“拖曳”功能需要 jQuery UI 之 droppable 库 效果如下:搜索包含相关关键字时,把拖曳左边关键字到右边框里面 也可以在输入框里输入自定义关键字到下面框 即可搜索 如果去掉不需要的关键词 搜索时 把不需要的关键词从右边框拖曳回到左边 即可 无论原来还是自定义加入的关键词 如果已存在 她会提示... 实现: 代码如下:<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> <script type=...
找到了下面这个js 代码如下:function SetCwinHeight(obj) { var cwin=obj; if (document.getElementById) { if (cwin && !window.opera) { if (cwin.contentDocument && cwin.contentDocument.body.offsetHeight) cwin.height = cwin.contentDocument.body.offsetHeight + 20; else if(cwin.Document && cwin.Document.body.scrollHeight) cwin.height = cwin.Document.body.scrollHeight + 10; } } } 然后…… 进入了测试过程(调...
代码如下:<script type="text/javascript"> <!-- $( function() { //iframe高度随内容自动调整 $('.main').load( function() { $(this).height($(this).contents().find("body").attr('scrollHeight')); } ); } ); // --> </script>
小项目龙里中学多媒体教室管理系统中后台管理用到了iframe.由于要动态载入内容,所以需要iframe自适应内容页的高度.用谷歌搜索到很多答案,其中成功的是这段代码 代码如下:<script type="text/javascript"> function SetCwinHeight() { var iframeid = document.getElementById("maincontent1"); //iframe id if (document.getElementById) { if (iframeid && !window.opera) { if (iframeid.contentDocument && iframeid.contentDoc...