发布于 2016-12-06 22:56:55 | 143 次阅读 | 评论: 0 | 来源: 网友投递

这里有新鲜出炉的Javascript教程,程序狗速度看过来!

JavaScript客户端脚本语言

Javascript 是一种由Netscape的LiveScript发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如Perl,遗留的速度问题,为客户提供更流畅的浏览效果。




<!--文件头模板--> 
<SCRIPT src=top.js></SCRIPT> 
<SCRIPT language=javascript> 
    writeTop('Flash滚动显示图片代码生成','2006-10-18'); 
</SCRIPT> 

<!--以下为内容--> 
<SCRIPT> 
//运行代码 
function runEx(cod1)  { 
     cod=document.getElementById(cod1) 
      var code=cod.value; 
      if (code!=""){ 
          var newwin=window.open('','','');   
          newwin.opener = null  
          newwin.document.write(code);   
          newwin.document.close(); 
    } 
} 
//复制代码 
function doCopy(ID) {  
    if (document.all){ 
         textRange = document.getElementById(ID).createTextRange();  
         textRange.execCommand("Copy");  
    } 
    else{ 
         alert("此功能只能在IE上有效") 
    } 
} 

//展开_收起段落 
function close_open(theID){ 
    if(document.getElementById(theID).style.display!='none') { 
        document.getElementById(theID).style.display='none'; 
    } 
    else  
        document.getElementById(theID).style.display='block'; 
} 
</SCRIPT> 

<SCRIPT language=javascript> 
    //生成代码 
    function genCode() 
    { 
        var html=''; 
        var picUrl=''; 
        var picLink=''; 
        var picTitle=''; 
        var picWidth=0; 
        var picHeight=0; 
        var titleHeight=0; 
        var backgroudn=''; 

        { 
            var tempUrl=''; 
            var tempLink=''; 
            var tempTitle=''; 
            for(i=0;i<9;++i){ 
                tempUrl=document.getElementById('picUrl_'+(1+i)).value; 
                tempLink=document.getElementById('picLink_'+(1+i)).value; 
                tempTitle=document.getElementById('picTitle_'+(1+i)).value; 
                if(tempUrl == '')continue; 
                if(tempLink == '')tempLink=tempUrl; 
                if(tempTitle == '')tempTitle='无题'; 
                picUrl   += tempUrl + '|'; 
                picLink  += tempLink + '|'; 
                picTitle += tempTitle + '|'; 
            } 
            picUrl = picUrl.substring(0,picUrl.length-1); 
            picTitle = picTitle.substring(0,picTitle.length-1); 
            picLink = picLink.substring(0,picLink.length-1); 
            picWidth = parseInt(document.getElementById('picWidth').value); 
            picHeight=parseInt(document.getElementById('picHeight').value); 
            titleHeight = parseInt(document.getElementById('titleHeight').value); 
            backgroudn = document.getElementById('backgroudn').value; 
        } 

        html += '<EMBED pluginspage=http://www.macromedia.com/go/getflashplayer src=http://staryxy.googlepages.com/PicPlay.swf'; 
        html += ' width='  + picWidth; 
        html += ' height=' + (picHeight + titleHeight); 
        html += ' type=application/x-shockwave-flash WMODE="opaque" FLASHVARS="'; 
        html += 'pics='+picUrl; 
        html += '&links='+picLink; 
        html += '&texts='+picTitle; 
        html += '&borderwidth=' + picWidth; 
        html += '&borderheight=' + picHeight; 
        html += '&textheight=' + titleHeight; 
        html += '" MENU="false"'; 
        html += ' BGCOLOR="' + backgroudn; 
        html += '" QUALITY="high" ALLOWSCRIPTACCESS="sameDomain"></EMBED>'; 

        document.getElementById('ShowCode').value = html; 
        show.innerHTML = html; 
    } 
</SCRIPT> 

<div style="margin-top:5px;background:#9abcde"> 
<div style='cursor:hand' onclick=close_open('edit')><li>设置</li></div> 
<div id='edit' style="margin-left:15px; display:block;"> 
    <div style="background:#cdcdcd"> 
        图片显示宽度:<input size=10 id=picWidth   title="图片显示宽度" value="300"></input> 
        图片显示高度:<input size=10 id=picHeight  title="图片显示高度" value="200"></input> 
        文字区域高度:<input size=10 id=titleheight title="文字区域高度" value="20"></input> 
        背景色:<input size=10 id=backgroudn title="背景色" value='#cdcdcd'></input> 
    </div> 
    <div style="background:#eeeeee"> 
        图片一: 
        <input maxlength=2048 size=25 id=picUrl_1 value="http://staryxy.googlepages.com/diner1.jpg" title="图片URL地址"></input> 
        链接地址:<input maxlength=2048 size=25 id=picLink_1 value="" title="链接地址"></input> 
        说明:<input maxlength=2048 size=20 id=picTitle_1 value="「夜宴」搞恶图片1" title="说明"></input> 
    </div> 
    <div style="background:#cdcdcd"> 
        图片二: 
        <input maxlength=2048 size=25 id=picUrl_2 value="http://staryxy.googlepages.com/diner2.jpg" title="图片URL地址"></input> 
        链接地址:<input maxlength=2048 size=25 id=picLink_2 value="" title="链接地址"></input> 
        说明:<input maxlength=2048 size=20 id=picTitle_2 value="「夜宴」搞恶图片2" title="说明"></input> 
    </div> 
    <div style="background:#eeeeee"> 
        图片三: 
        <input maxlength=2048 size=25 id=picUrl_3 value="http://staryxy.googlepages.com/diner4.jpg" title="图片URL地址"></input> 
        链接地址:<input maxlength=2048 size=25 id=picLink_3 value="" title="链接地址"></input> 
        说明:<input maxlength=2048 size=20 id=picTitle_3 value="「夜宴」搞恶图片3" title="说明"></input> 
    </div> 
    <div style="background:#cdcdcd"> 
        图片四: 
        <input maxlength=2048 size=25 id=picUrl_4 value="http://staryxy.googlepages.com/diner7.jpg" title="图片URL地址"></input> 
        链接地址:<input maxlength=2048 size=25 id=picLink_4 value="" title="链接地址"></input> 
        说明:<input maxlength=2048 size=20 id=picTitle_4 value="「夜宴」搞恶图片4" title="说明"></input> 
    </div> 
    <div style="background:#eeeeee"> 
        图片五: 
        <input maxlength=2048 size=25 id=picUrl_5 value="http://staryxy.googlepages.com/diner8.jpg" title="图片URL地址"></input> 
        链接地址:<input maxlength=2048 size=25 id=picLink_5 value="" title="链接地址"></input> 
        说明:<input maxlength=2048 size=20 id=picTitle_5 value="「夜宴」搞恶图片5" title="说明"></input> 
    </div> 
    <div style="background:#cdcdcd"> 
        图片六: 
        <input maxlength=2048 size=25 id=picUrl_6 value="http://staryxy.googlepages.com/diner12.jpg" title="图片URL地址"></input> 
        链接地址:<input maxlength=2048 size=25 id=picLink_6 value="" title="链接地址"></input> 
        说明:<input maxlength=2048 size=20 id=picTitle_6 value="「夜宴」搞恶图片6" title="说明"></input> 
    </div> 
    <div style='cursor:hand' onclick=close_open('editmore')><li>更多(推荐6张以下,否则说明将看不到)</li></div> 
    <div id='editmore' style='display:none;'> 
        <div style="background:#eeeeee"> 
            图片七: 
            <input maxlength=2048 size=25 id=picUrl_7 value="" title="图片URL地址"></input> 
        链接地址:<input maxlength=2048 size=25 id=picLink_7 value="" title="链接地址"></input> 
        说明:<input maxlength=2048 size=20 id=picTitle_7 value="" title="说明"></input> 
        </div> 
        <div style="background:#cdcdcd"> 
            图片八: 
            <input maxlength=2048 size=25 id=picUrl_8 value="" title="图片URL地址"></input> 
        链接地址:<input maxlength=2048 size=25 id=picLink_8 value="" title="链接地址"></input> 
        说明:<input maxlength=2048 size=20 id=picTitle_8 value="" title="说明"></input> 
        </div> 
        <div style="background:#eeeeee"> 
            图片九: 
            <input maxlength=2048 size=25 id=picUrl_9 value="" title="图片URL地址"></input> 
        链接地址:<input maxlength=2048 size=25 id=picLink_9 value="" title="链接地址"></input> 
        说明:<input maxlength=2048 size=20 id=picTitle_9 value="" title="说明"></input> 
        </div> 
    </div> 
</div> 
<div> 
    <input type=button onclick='javascript:genCode();' value=生成代码> 
    </input> 
</div> 
</div> 


<div style="margin-top:5px;background:#9abcde"> 
<div onclick=close_open('code')  style='cursor:hand'><li>代码</li></div> 
<div id='code' style='margin-left:15px;display:none;'> 
<TEXTAREA rows="15" id="ShowCode" style="width:100%"> 
<!--此处显示结果代码--> 
</TEXTAREA> 
</div> 
<div> 
    <INPUT onclick="runEx('ShowCode')"  type="button" value="运行此代码"/> 
    <INPUT onclick="doCopy('ShowCode')"  type="button" value="复制此代码"/> 
    [Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行] 
</div> 
</div> 



<div style="margin-top:5px;background:#9abcde;"> 
    <div onclick=close_open('show')  style='cursor:hand'><li>显示效果</li></div> 
    <div id='show' title="显示效果" align=center style="margin-left:15px;display:none;background:#abcdef"> 
    还没有 
    </div> 
</div> 
</div>


最新网友评论  共有(0)条评论 发布评论 返回顶部

Copyright © 2007-2017 PHPERZ.COM All Rights Reserved   冀ICP备14009818号  版权声明  广告服务