设为首页收藏本站
切换到窄版

 找回密码
 注册
搜索
热搜: 超星 读书 找书
网上读书园地»论坛 › 社区交流 › 多媒体空间 › 照片音画的部分总结：图片简单翻页制作特效 ...
返回列表 发新帖
查看: 1763|回复: 6

[美术设计♡] 照片音画的部分总结：图片简单翻页制作特效

[复制链接]
xaywg
发表于 2012-7-27 16:50:22 | 显示全部楼层 |阅读模式
游客，本帖隐藏的内容需要积分高于 20120727 才可浏览，您当前积分为 0



经常看到多媒体版块的精美照片的发帖，美轮美奂，令人目不暇接。
为了达到更好的欣赏效果，我把几个月学习的部分简单音画发帖总结出来，希望对多媒体版块的发帖技术有所帮助。
说明，可以在发完照片之后，另外再来一个音画发帖。这不是刻意做作，而是为了得到更好的图片展示效果。
注意，音画的时间有效性可能并不长久，下面介绍的都是我推荐的一些网站。

一： 论坛发图片尽量用外链上传：
1、我自己经常用的外链，缺点是需要注册
2、zhangred推荐的网站
3、emppp推荐的网站

二：翻页效果1预览，你需要的代码:网页浏览器 → 查看 → 源文件直接另存为txt
你需要做的事情其实很简单，只需要下面几步就可以：
1. 得到代码后修改下面颜色部分，没有颜色的部分不用管；
2. 修改完成后，上传修改好的 到 txt空间
  ① .  空间贴免费上传空间 优先推荐，支持htlm、txt、swf等后缀，但需要注册
  ②.  空间贴免费上传空间 推荐这个
  ③   空间贴免费上传空间


3. 复制第二步的地址，发到论坛就ok，一般可以这样发帖
  “ 你希望出现在论坛，大家都可以看到的文字”

代码如下，注意不要复制下面的代码，代码应该从上面的 翻页效果1预览，用右键查看源文件得到：


<html>
<head>
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=gb2312\">
<title>音画网页左上角出现的文字，可以不用修改</title>
</head>

<body bgcolor=\"#fef4d9\" onload=initiate()>
<SPAN id=imgcontainer1 style=\"HEIGHT: 480px; LEFT: 0px; POSITION: absolute; TOP: 0px; WIDTH: 600px\"></SPAN>
<SPAN id=imgcontainer2 style=\"HEIGHT: 480px; LEFT: 0px; POSITION: absolute; TOP: 0px; WIDTH: 600px\"></SPAN>
<SCRIPT>

<!--下面红色部分添加上你要展现的图片外链地址就可以了

var imgwidth=640 <!--特别注意：一定要修改，这里的640 和 480 两个数字就是你的图片大小像素，
var imgheight=480
var pos_left=0
var pos_top=0
var imgname=new Array()
imgname[0]=\"http://www.readfree.net/bbs/p_w_upload/Mon_1203/51_50525_18d6fbcc14fc5f5.jpg\"
imgname[1]=\"http://www.readfree.net/bbs/p_w_upload/Mon_1203/51_50525_0ef43a4c804d455.jpg\"
imgname[2]=\"http://www.readfree.net/bbs/p_w_upload/Mon_1203/51_50525_ceb1cc73666ecd9.jpg\"
imgname[3]=\"http://www.readfree.net/bbs/p_w_upload/Mon_1203/51_50525_ba39aeafdb40e27.jpg\"
imgname[4]=\"http://www.readfree.net/bbs/p_w_upload/Mon_1203/51_50525_fce47fb36e39442.jpg\"
imgname[5]=\"http://www.readfree.net/bbs/p_w_upload/Mon_1203/51_50525_7493e7a3738b516.jpg\"
<!--如果图片很多就继续自己添加类似代码，注意修改数字：  imgname[6]=\"\"

var imgpreload=new Array()
for (i=0;i<=imgname.length-1;i++) {
imgpreload=new Image()
imgpreload.src=imgname
}

var pause=2000
var speed=20
var step=10
var i_loop=0
var i_p_w_picpath1=0
var i_p_w_picpath2=1

function stretchp_w_picpath() {
if (i_loop<=imgwidth) {
if (document.all) {
  imgcontainer1.innerHTML=\"<img width=&#39;\"+i_loop+\"&#39; height=&#39;\"+imgheight+\"&#39; src=&#39;\"+imgname[i_p_w_picpath1]+\"&#39; border=&#39;0&#39;>\"
  document.all.imgcontainer2.style.posLeft=document.all.imgcontainer1.style.posLeft+i_loop
  
  imgcontainer2.innerHTML=\"<img width=&#39;\"+(imgwidth-i_loop)+\"&#39; height=&#39;\"+imgheight+\"&#39; src=&#39;\"+imgname[i_p_w_picpath2]+\"&#39; border=&#39;0&#39;>\"
}
i_loop=i_loop+step
var timer=setTimeout(\"stretchp_w_picpath()\",speed)
  }
else {
clearTimeout(timer)
changep_w_picpath()
}

}
function changep_w_picpath() {
i_loop=0
i_p_w_picpath1++
if (i_p_w_picpath1>imgname.length-1) {i_p_w_picpath1=0}
i_p_w_picpath2=i_p_w_picpath1-1
if (i_p_w_picpath2>imgname.length-1) {i_p_w_picpath2=0}
if (i_p_w_picpath2<0) {i_p_w_picpath2=imgname.length-1}

document.all.imgcontainer2.style.posLeft=document.all.imgcontainer1.style.posLeft
  var timer=setTimeout(\"stretchp_w_picpath()\",pause)
}
function initiate() {
if (document.all) {
document.all.imgcontainer1.style.posLeft=pos_left
document.all.imgcontainer2.style.posLeft=pos_left
document.all.imgcontainer1.style.posTop=pos_top
document.all.imgcontainer2.style.posTop=pos_top
changep_w_picpath()
}
if (document.layers) {
document.imgcontainer1.left=pos_left
document.imgcontainer2.left=pos_left
document.imgcontainer1.top=pos_top
document.imgcontainer2.top=pos_top
rotatenetscape()
}
}

// - End of JavaScript - -->
</SCRIPT>



<SCRIPT language=JavaScript><!--
msg=\"【网 上 读 书 园 地 论 坛】* * * 网页左下角你想写的飘动文字，也可以不改\";timeID=10;stcnt=16;wmsg=new Array(33);wmsg[0]=msg;blnk=\"                                \";for(i=1;i<32;i++){b=blnk.substring(0,i);wmsg=\"\";for(j=0;j<msg.length;j++)wmsg=wmsg+msg.charAt(j)+b;}function wiper(){if(stcnt>-1)str=wmsg[stcnt];else str=wmsg[0];if(stcnt--<-40)stcnt=31;status=str;clearTimeout(timeID);timeID=setTimeout(\"wiper()\",100);}wiper()
//--></SCRIPT>
<script language=\"JavaScript\">
<!--
if (window.Event)
document.captureEvents(Event.MOUSEUP);
function nocontextmenu()
{
event.cancelBubble = true
event.returnValue = false;
return false;
}
function norightclick(e)
{
if (window.Event)
{
if (e.which == 2 || e.which == 3)
  return false;
}
else
if (event.button == 2 || event.button == 3)
{
  event.cancelBubble = true
  event.returnValue = false;
  return false;
}
}
document.oncontextmenu = nocontextmenu; // for IE5+
document.onmousedown = norightclick; // for all others
//-->
</script>

<><EMBED style=\"FILTER: xray()\" src=http://www1.beiwaionline.com/btc/mag/03nov/you%20took%20my%20heart%20away.mp3 width=0 height=0 type=audio/x-ms-wma showstatusbar=\"0\" loop=\"true\" autostart=\"true\"> </P>

<!-- 颜色部分改成你需要的音乐，格式mp3、asf、wma、wmv、wmv、rm应该都支持，缺点是时间有效性总是很短，推荐使用搜狗音乐


</body>
</html>
回复

使用道具 举报

xaywg
 楼主| 发表于 2012-7-27 17:38:07 | 显示全部楼层

再来个稍微复杂一点的
二：自动翻页2预览，你需要的代码:网页浏览器 → 查看 → 源文件直接另存为txt
      再给个可供参考的代码
      再再给个可供参考的代码


代码如下：


<!-- 注意要修改背景大图片的宽度和高度，然后把地址添加到这里
<TABLE style="OSITION: relative; LEFT: 0px; TOP: 0px; WIDTH: 1000px" cellSpacing=0 cellPadding=0 background=背景大图片外链 border=0>

<TBODY>
<TR>
<TD align=center>

< class=bt_zz align=center>
<FONT color=#B0171F size=6 face=楷体_GB2312><STRONG><B><BR>xilou001a</B></STRONG></FONT><BR>
<FONT color=#8A2BE2 size=4 face=楷体_GB2312><STRONG><B>欢迎您光临≮网上读书园地论坛≯·多媒体空间</B></STRONG></FONT>
</P>

<!-- 下面是嵌套了一个翻页的 txt 音画贴，方法跟1楼的txt制作方法一模一样，注意也需要上传空间，然后把地址添加到这里就可以了
<DIV style="OSITION: relative; LEFT: 0px; TOP: 0px; WIDTH: 756px">
<IFRAME height=500 marginHeight=0 src="http://txt.meqzone.com/up4/1342532793_2102187861.txt" frameBorder=0 width=756 marginWidth=0 scrolling=no></IFRAME>
</DIV>
</TD>
</TR>

<SCRIPT language=JavaScript>
var text1="  *☆☆☆☆ 多媒体空间版块欢迎你 ☆☆☆☆ "
comeback=0
cometo=0
function dis(){
window.status=text1.substring(0,cometo)
if(comeback==1){
cometo--;
if(cometo==0){comeback=0}
} else {cometo++;if(cometo==text1.length){comeback=1}}
window.status=text1.substring(0,cometo)+"~~@@"
if(cometo==text1.length){window.setTimeout("dis()",1000);} else {window.setTimeout("dis()",50);}
}
dis()
// -->
</SCRIPT>

<!-- 下面蓝色部分是你的音乐地址，注意 不支持视频，推荐用搜狗音乐
<EMBED src=http://data1.act.qq.com/201010/11/18/128679379728131.mp3 hidden=true type=audio/mpeg autostart="true" loop="true"></EMBED>

</TBODY>
</TABLE>
回复

使用道具 举报

xaywg
 楼主| 发表于 2012-7-27 18:12:11 | 显示全部楼层
游客，本帖隐藏的内容需要积分高于 10 才可浏览，您当前积分为 0
回复

使用道具 举报

redfllys
发表于 2012-7-27 21:20:04 | 显示全部楼层
谁测试一下看看效果
回复

使用道具 举报

小猫出发
发表于 2012-7-27 21:24:43 | 显示全部楼层
还有音乐呢？
配乐更好听啊
回复

使用道具 举报

killl
发表于 2012-7-31 23:23:15 | 显示全部楼层
原理就是链接过去？

相当于自己做个网页了。

论坛的版本较老，应该只支持图片嵌入。
回复

使用道具 举报

xaywg
 楼主| 发表于 2012-8-5 23:45:11 | 显示全部楼层
不影响论坛发图片的，完全可以在发完图片以后，另外再制作一个这样的外链，增强图片显示效果。.
正如我在1楼主题帖红色文字说明的那样，之前的很多图片发帖增加这么一个简单制作的音画贴，效果会更好的，因为园地的很多图片处理的发帖，实在是不堪入目的，干巴巴放到那里，很难吸引人注意。
只不过稍微增加几个外链地址，虽然并不一定是发帖后直接观赏的那种效果，但几分钟就可以制作好的，有兴趣的不妨尝试一下。
这个代码相对比较简单，只需要置换代码中的图片外链地址即可
回复

使用道具 举报

返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 注册

本版积分规则

Archiver|手机版|小黑屋|网上读书园地

GMT+8, 2024-5-19 15:23 , Processed in 0.280488 second(s), 5 queries , Redis On.

Powered by Discuz! X3.5

© 2001-2024 Discuz! Team.

快速回复 返回顶部 返回列表