1、網頁製作怎麼弄多張圖片的翻轉效果
http://young.boustead.e.cn/data/index_flash/vip.html
是不是這種效果?
如果是的,短消息我內,我教容你
2、網頁製作中如何做翻轉圖片
<!--以下是新聞圖片代碼-->
<SCRIPT language=JavaScript>
var IMGArray = new Array(5);
var TXTArray = new Array(5);
var TheIMGIndex=0;
var garTransitions = new Array(10);
var speed = 5000;
garTransitions[0] = "RandomDissolve()";
garTransitions[1] = "Iris(irisStyle='star', motion='out')";
garTransitions[2] = "Iris(irisStyle='diamond', motion='in')";
garTransitions[3] = "Iris(irisStyle='cross', motion='out')";
garTransitions[4] = "Iris(irisStyle='circle', motion='in')";
garTransitions[5] = "Iris(irisStyle='plus', motion='in')";
garTransitions[6] = "Barn(orientation='vertical', motion='in')";
garTransitions[7] = "Barn(orientation='vertical', motion='out')";
garTransitions[8] = "Barn(orientation='horizontal', motion='in')";
garTransitions[9] = "Barn(orientation='horizontal', motion='out')";
function IMGTXTChange(INC_Index)
{
var INCAOBJ,NCTDOBJ;
for(var I=0;I<5;I++)
{
INCAOBJ=eval("document.all.ChangeA" + I);
INCTDOBJ=eval("document.all.ChangeTD" + I);
if (INC_Index==I)
{
TheIMGIndex=I;
INCTDOBJ.style.backgroundColor='#0066ff';
INCAOBJ.style.color='#ffffff';
}
else
{
INCTDOBJ.style.backgroundColor='#333333';
INCAOBJ.style.color='#ffffff';
}
}
var INCImage=document.all.TheChangeIMG;
var FilterStr="progid:DXImageTransform.Microsoft." + garTransitions[INC_Index+1];
INCImage.style.filter = FilterStr;
INCImage.filters.item(0).Apply();
INCImage.filters.item(0).Play(2.0);
var TheTrunImage=new Image;TheTrunImage.src=IMGArray[INC_Index];
document.all.TheChangeIMG.src=TheTrunImage.src;
//document.all.ChangeTXTDIV.innerHTML=TXTArray[INC_Index];
}
IMGArray[0]="image/1.JPG";
IMGArray[1]="image/2.JPG";
IMGArray[2]="image/3.JPG";
IMGArray[3]="image/4.JPG";
IMGArray[4]="image/5.JPG";
function SwitchPiture()
{
TheIMGIndex++;
if (TheIMGIndex>4){TheIMGIndex=0}
IMGTXTChange(TheIMGIndex);
TimeTurn=setTimeout("SwitchPiture()",speed);
}
function MouseOver(INC_OBJ)
{
INC_OBJ.style.color='#990000';
INC_OBJ.style.textDecoration='underline';
}
function MouseOut(INC_OBJ)
{
INC_OBJ.style.color='#000000';
INC_OBJ.style.textDecoration='none';
}
// - 控制自動播放
function AutoPlay() {
speed = 3000;
SwitchPiture();
}
// - \控制自動播放
window.onload = function() {
AutoPlay();
}
</SCRIPT>
放到<head>之間
<DIV
style="BORDER-RIGHT: #0066ff 1px solid; BORDER-TOP: #0066ff 1px solid; BORDER-LEFT: #0066ff 1px solid; WIDTH: 307px; BORDER-BOTTOM: #0066ff 1px solid; POSITION: relative; HEIGHT: 100%; BACKGROUND-COLOR: #ffffff">
<DIV
style="BORDER-RIGHT: #ff0000 0px solid; BORDER-TOP: #ff0000 0px solid; BORDER-LEFT: #ff0000 0px solid; WIDTH: 307px; BORDER-BOTTOM: #ff0000 0px solid; HEIGHT: 173px; BACKGROUND-COLOR: #0000ff"><img
id=TheChangeIMG height=220 src="image/0.jpg"
width=307 name=TheChangeIMG></DIV>
<DIV
style="LEFT: 0px; WIDTH: 100%; BOTTOM: 0px; POSITION: absolute; HEIGHT: 18px; BACKGROUND-COLOR: transparent; TEXT-ALIGN: right">
<TABLE style="FONT-SIZE: 12px; HEIGHT: 18px; TEXT-ALIGN: center"
cellSpacing=0 cellPadding=0 border=0>
<TBODY>
<TR>
<TD id=ChangeTD0 style="BACKGROUND-COLOR: #000000" width=22
name="ChangeTD0"><A id=ChangeA0
style="FONT-WEIGHT: bold; CURSOR: hand; COLOR: #ffffff; TEXT-DECORATION: underline"
onclick=IMGTXTChange(0) name=ChangeA0>1</A></TD>
<TD style="BACKGROUND-COLOR: #ffffff" width=1></TD>
<TD id=ChangeTD1 style="BACKGROUND-COLOR: #000000" width=22
name="ChangeTD1"><A id=ChangeA1
style="FONT-WEIGHT: bold; CURSOR: hand; COLOR: #ffffff; TEXT-DECORATION: underline"
onclick=IMGTXTChange(1) name=ChangeA1>2</A></TD>
<TD style="BACKGROUND-COLOR: #ffffff" width=1></TD>
<TD id=ChangeTD2 style="BACKGROUND-COLOR: #000000" width=22
name="ChangeTD2"><A id=ChangeA2
style="FONT-WEIGHT: bold; CURSOR: hand; COLOR: #ffffff; TEXT-DECORATION: underline"
onclick=IMGTXTChange(2) name=ChangeA2>3</A></TD>
<TD style="BACKGROUND-COLOR: #ffffff" width=1></TD>
<TD id=ChangeTD3 style="BACKGROUND-COLOR: #000000" width=22
name="ChangeTD3"><A id=ChangeA3
style="FONT-WEIGHT: bold; CURSOR: hand; COLOR: #ffffff; TEXT-DECORATION: underline"
onclick=IMGTXTChange(3) name=ChangeA3>4</A></TD>
<TD style="BACKGROUND-COLOR: #ffffff" width=1></TD>
<TD id=ChangeTD4 style="BACKGROUND-COLOR: #000000" width=22
name="ChangeTD4"><A id=ChangeA4
style="FONT-WEIGHT: bold; CURSOR: hand; COLOR: #ffffff; TEXT-DECORATION: underline"
onclick=IMGTXTChange(4)
name=ChangeA4>5</A></TD></TR></TBODY></TABLE></DIV></DIV>
放到表格中;自己再修改一下圖片路徑!
3、HTML 有沒有代碼可以實現網頁翻轉功能?
可以用控制div的顯現的方式。可以用js。
舉個列子:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>div顯現與隱藏</title>
<script language="JavaScript" type="text/JavaScript">
<!--
function toggle(targetid){
if (document.getElementById){
target=document.getElementById(targetid);
if (target.style.display=="block"){
target.style.display="none";
} else {
target.style.display="block";
}
}
}
-->
</script>
<style type="text/css">
<!--
#div1{
background-color:#000000;
height:400px;
width:400px;
display:none;
}
-->
</style>
</head>
<body>
<input type="button" id="butn" value="顯示/隱藏" onclick="toggle('div1')" />
<center>
<div id="div1"></div></center>
</body>
</html>
4、網頁設計中怎麼實現圖片旋轉
css3 的transform屬性允許我們旋轉、縮放和移動元素。 可以通過給它傳遞一個 rotate(度數) 值來旋轉一個元素,正值表示順時針方向旋轉,負值表示逆時針方向旋轉,旋轉的中心點為元素的中心。
CSS代碼如下:
.rotate{
-ms-transform:rotate(90deg); /* IE 9 */
-moz-transform:rotate(90deg); /* Firefox */
-webkit-transform:rotate(90deg); /* Safari and Chrome */
-o-transform:rotate(90deg); /* Opera */
}
瀏覽器支持:Firefox 4+、Oprea 10+、Safari 3.1+、Chrome 8+、IE 9+
5、如何用DREAMWEAVER完成網頁製作多張圖片的翻轉效果
應用flash 元素----圖象查看器
1.新建一個HTML文件
2.選擇[插入記錄]->[媒體]->[圖象查看器]命令,彈出"保存flash 元素"對話框.在"文件名"文本框中輸入要保存的文件名,然後單擊保存按紐.
3.這時,"文檔編輯區"出現一個灰色的圖象查看器佔位符,並且面板組中展開了一個"flash 元素"面板.在"flash 元素"面板中可以設置相關的參數,以實現需要的功能和效果(如顏色等,也可不設置)
4.在"flash 元素"面板中,單擊選擇"imageURLs"參數項,然後單擊這個參數項右邊的按鈕,彈出"編輯imageURLs數組"對話框.
5.單擊"image1.jpg",然後單擊它右側的按鈕,彈出"選擇文件"對話框,在其中選擇一個圖象文件,然後單擊"確定"
6.按照同樣的方法,再設置幾個圖象文件
7.單擊"確定"按鈕,完成要展示的圖象的設置
6、網頁設計css怎麼設置圖片翻轉
transform屬性,方法有很多,可以設置不同的翻轉
7、關於網頁設計問題(頁面翻頁方式)
你只的是先隱藏大部分只顯示出主要內容。而後在需要的情況下點擊下拉箭頭或是類似於「更多」這種。在同一個頁面顯示出更多的內容是吧。 事實上我不太曉得你用的是什麼語言編寫的網頁。推薦使用JAVA。這樣,下半部分做在另一個頁面。而原始頁面只需要使用表格嵌套就OK了
8、PS做的網頁翻轉按鈕如何插入網頁啊
用記事本打開HTML文件,復制裡面的代碼。把代碼粘貼到你製作的網頁文件里的你需要的位置,然後記得把image文件夾放到你製作的網頁文件的同一目錄下就可以了。
9、HTML 如何實現頁面翻轉效果 請給例子
可以用控制div的顯現的方式。可以用js。
舉個列子:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>div顯現與隱藏</title>
<script language="JavaScript" type="text/JavaScript">
<!--
function toggle(targetid){
if (document.getElementById){
target=document.getElementById(targetid);
if (target.style.display=="block"){
target.style.display="none";
} else {
target.style.display="block";
}
}
}
-->
</script>
<style type="text/css">
<!--
#div1{
background-color:#000000;
height:400px;
width:400px;
display:none;
}
-->
</style>
</head>
<body>
<input type="button" id="butn" value="顯示/隱藏" onclick="toggle('div1')" />
<center>
<div id="div1"></div></center>
</body>
</html>
我把核心給你寫好了,剩下的就靠你自己裝飾一下了。比如把div誇大到全屏,該div 內容等。。