JS&RE 控制图片显示大小, 弹出窗口自适应大小,自居中, 结合UBB与正则使用 By Stabx

原创 2006年05月24日 18:36:00
标题: JS&RE 控制图片显示大小, 弹出窗口自适应大小,自居中, 结合UBB与正则使用 By Stabx
正文:

QUOTE:


实现功能:
1. 图片宽度如果大于 ##, 则显示为 ##, 小于则显示为默认. /Javascript 
2. 点击图片弹出图片链接, 窗口自动适应图片大小, 并且弹出窗口居中显示. /Javascript
注: 可在页面上使用任何次数, 不需指定ID.

其他:
1. 正则替换 UBB 输入格式的图片地址为 热链接 /Regular Expression - encode
2. 正则解码 HTML IMG 标签. /Regular Expression - decode 

shawl.qiu 
2006-5-24

 

CODE:

Javascript 函数:

 

 

CODE:

正则替换:


//这是 ASP VBSCRIPT 中的正则
Regular Expression:
1. 正则替换 UBB IMG 标签为 HTML IMG 标签:
正则内容:
         re.Pattern = "/[img/]((http/:////)|())(.*?)/[//img/]"
         str = re.Replace(str,"<img onload=""this.width=show(this.width)"" onClick=""openautosize(this.src)"" src=$2$3$4>") 

2. 正则解码 HTML IMG 标签为 UBB IMG 标签
正则内容:
         re.Pattern = "<img.*?src=(.*)?/>"
         Str = re.Replace(Str,"[img]$1[/img]")

注: 使用正则特别特别要注意的就是各个正则的使用顺序.

 

 


<script LANGUAGE="JAVASCRIPT">
     //检查图片大小是否大于预期大小, 大于则显示为预期大小
     function show(chkw) { //chk size
                 if(chkw>500) {
                     chkw=500;
                     }
                 else {
                     chkw=chkw;
                 }
                 return chkw;
             }//script by shawl.qiu
     //example: <img src="images/03.jpg" onClick="openautosize(this.src)" onload="this.width=show(this.width)">
    
     //弹出窗口, 自适应图片大小,并自动居中显示
     function openautosize(ourl) { //ourl 为接收图片地址
             dimg = new Image(); //建立图像对象
             dimg.src = ourl; //确定图像地址
             w = dimg.width ; //图像宽度
             h = dimg.height; //图像高度
             x = (screen.width - w) / 2; //减去图片宽度, 然后宽/2
             y = (screen.height - h) / 2; //减去图片高度, 然后宽/2
             window.open(ourl,"newwindow","location=1,width="+w+",height="+h+",top="+y+",bottom="+y+",left="+x+",right="+x) ;
         }//shawl.qiu script
     //example:  <img src="images/03.jpg" onClick="openautosize(this.src)" onload="this.width=show(this.width)">
</script>

示例:
               <img src="images/03.jpg" onClick="openautosize(this.src)" onload="this.width=show(this.width)" ><br>
         <img src="images/01.jpg" onClick="openautosize(this.src)" onload="this.width=show(this.width)" >

ubb使用说明

什么是 UBB 代码?UBB 代码是HTML的一个变种. 你也许已经对它很熟悉了。UBB代码对于网上公告板之类的信息交互的平台,是比HTML更加安全的代码。由于要求使用的编码很少,所以可以非常轻松的取...
  • sfwap
  • sfwap
  • 2005年07月10日 16:56
  • 743

正则表达式在UBB论坛中的应用

一、读者指引   读者指引帮助你掌握本文的梗概。以免你看了大半才明白这编文章不适合你,给你造成视觉污染。   如果你正在用ASP写程序,或者你正在写一些诸如BBS、留言溥或表单数据检查之类的东东那就...
  • lovelium
  • lovelium
  • 2007年03月07日 09:01
  • 310

Qt 根据Label大小无形变的自适应居中显示图像

效果图: 实现代码: QImage ScaleImage2Label(QImage qImage, QLabel* qLabel) { QImage qScaledImage; QSi...
  • chengzhongxuyou
  • chengzhongxuyou
  • 2017年06月26日 22:25
  • 2255

css让图片自适应大小

 #auto_image img{ max-width:460px;autoimg:expression(onload=function(){this.style.width=(this.offset...
  • vince6799
  • vince6799
  • 2007年08月22日 22:38
  • 5843

Javascript 控制图片显示大小函数 By Stabx, 第二版

/*
  • btbtd
  • btbtd
  • 2006年06月04日 22:02
  • 1414

弹出窗口根据内容自动调整大小的JS解决方案

父类(主/打开)窗口中代码为:   html>head>title>父类窗口title>script type="text/javascript">...var s,oRes; function op...
  • beimuaihui
  • beimuaihui
  • 2007年09月21日 10:11
  • 1020

view上创建dialog,如何让dialog自动适应view的大小

假设有一个dialog类CMydialog,在一个view上显示这个对话框,然后让对话框的大小自适应view的大小,铺满view的窗口。可以这么做: 在CMyDialog里添加映射函数OnSize(...
  • abcdef8c
  • abcdef8c
  • 2012年08月22日 13:42
  • 4023

html5根据图片固定大小,使大小不等的图片居中显示 用于列表中显示的图片的统一处理

/* * 根据固定宽高的盒子,让图片自由居中显示的方法 * 盒子长200px,宽145px */ // $(".imgNeedChange")为通过jq获取到的图片数组,对单个图片进行处理时去...
  • hbubu
  • hbubu
  • 2017年12月15日 17:48
  • 83

jQuery 弹出窗口一直居中详细案例

jQuery弹出框 .div_back{ display:none; position:fixed; z-index:9998; top:0; left:0; width: 100%;...
  • w5167839
  • w5167839
  • 2014年11月03日 17:34
  • 2065

javascript控制图片显示大小

控制图片长宽少于120像素(用图片onload(this)事件激发)function DrawImage(srcobj){    var OImg=new Image();    OImg.src=s...
  • add8849
  • add8849
  • 2005年04月29日 10:53
  • 974
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:JS&RE 控制图片显示大小, 弹出窗口自适应大小,自居中, 结合UBB与正则使用 By Stabx
举报原因:
原因补充:

(最多只允许输入30个字)