用js实现的一个Flash滚动轮换显示图片代码生成器


Posted in Javascript onMarch 14, 2007
<!--文件头模板--> 
<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>
Javascript 相关文章推荐
jquery ui resizable bug解决方法
Oct 26 Javascript
JavaScript实现查找字符串中第一个不重复的字符
Dec 29 Javascript
JavaScript代码轻松实现网页内容禁止复制(代码简单)
Oct 23 Javascript
AngularJS实现分页显示数据库信息
Jul 01 Javascript
AngularJs Dependency Injection(DI,依赖注入)
Sep 02 Javascript
JavaScript 实现的checkbox经典实例分享
Oct 16 Javascript
微信JS SDK接入的几点注意事项(必看篇)
Jun 23 Javascript
浅谈angularJS的$watch失效问题的解决方案
Aug 11 Javascript
微信小程序表单验证WxValidate的使用
Nov 27 Javascript
javascript实现商品图片放大镜
Nov 28 Javascript
Vue学习之常用指令实例详解
Jan 06 Javascript
SpringBoot在yml配置文件中配置druid的操作
Nov 16 Javascript
js实现的网站首页随机公告随机公告
Mar 14 #Javascript
newxtree.js代码
Mar 13 #Javascript
xtree.js 代码
Mar 13 #Javascript
js资料prototype 属性
Mar 13 #Javascript
js资料toString 方法
Mar 13 #Javascript
pjblog修改技巧汇总
Mar 12 #Javascript
解决 firefox 不支持 document.all的方法
Mar 12 #Javascript
You might like
一篇入门的php Class 文章
2007/04/04 PHP
PHP批量获取网页中所有固定种子链接的方法
2016/11/18 PHP
PHP让网站移动访问更加友好方法
2019/02/14 PHP
初窥JQuery(二) 事件机制(1)
2010/11/25 Javascript
Jquery颜色选择器ColorPicker实现代码
2012/11/14 Javascript
浅析jquery的作用与优势
2013/12/02 Javascript
js 3秒后跳转页面的实现代码
2014/03/10 Javascript
用jquery.sortElements实现table排序
2014/05/04 Javascript
jquery采用oop模式class类的使用示例
2016/01/22 Javascript
jquery模拟多级复选框效果的简单实例
2016/06/08 Javascript
全面了解JavaScirpt 的垃圾(garbage collection)回收机制
2016/07/11 Javascript
Es6 写的文件import 起来解决方案详解
2016/12/13 Javascript
JS实现京东首页之页面顶部、Logo和搜索框功能
2017/01/12 Javascript
JS获取url参数,JS发送json格式的POST请求方法
2018/03/29 Javascript
利用JS实现一个同Excel表现的智能填充算法
2018/08/13 Javascript
详解javascript replace高级用法
2019/02/17 Javascript
vue组件中watch props根据v-if动态判断并挂载DOM的问题
2019/05/12 Javascript
javascript设计模式 ? 中介者模式原理与用法实例分析
2020/04/20 Javascript
[00:32]2018DOTA2亚洲邀请赛EG出场
2018/04/03 DOTA
[01:05:00]2018国际邀请赛 表演赛 Pain vs OpenAI
2018/08/24 DOTA
python从sqlite读取并显示数据的方法
2015/05/08 Python
Python中条件判断语句的简单使用方法
2015/08/21 Python
Python排序搜索基本算法之冒泡排序实例分析
2017/12/09 Python
python构建深度神经网络(DNN)
2018/03/10 Python
Python访问MongoDB,并且转换成Dataframe的方法
2018/10/15 Python
OpenCV+face++实现实时人脸识别解锁功能
2019/08/28 Python
Python数据可视化:箱线图多种库画法
2019/11/06 Python
python json.dumps中文乱码问题解决
2020/04/01 Python
pandas分组聚合详解
2020/04/10 Python
Python使用itcaht库实现微信自动收发消息功能
2020/07/13 Python
Python‘==‘ 及 ‘is‘相关原理解析
2020/09/05 Python
python利用appium实现手机APP自动化的示例
2021/01/26 Python
房地产融资计划书
2014/01/10 职场文书
员工保密协议书
2014/09/27 职场文书
寒假安全保证书
2015/02/28 职场文书
2015年信息中心工作总结
2015/05/25 职场文书