|
|
<!
8) 5 Inzomende foto’s
Ga hierboven naar "bewerken" en kies voor "alles
selecteren". Terug "bewerken" en dan "kopiëren"?. Open
nu outlook express en neem "nieuw bericht". Onderaan open je de
"bron" en klik tussen </BODY><!</HTML> <! Dat
is daar waar het groene tekens staan en klik daarna met de rechtermuisknop.
Kies nu voor "plakken" en onderaan op "voorbeeld". Je ziet
dat je mail klaar is behalve je foto's en tekst. De tekst kun je in de stand
"bewerken" aan passen en de foto's moet je in de "bron"
vervangen. En dat 5 maal, zie het blauwe deel: <IMG id=pic1 src="c:\image\wet\herfst.jpg” >
<HTML>
<HEAD>
<TITLE>Valentine
Special</TITLE>
<STYLE
TYPE="text/css">
<!--
body {
font-family: "Comic Sans MS";
font-size: 14pt;
font-weight: bold;
margin-left: 10;
margin-right: 10;
background-color: #000000;
color: #A04040;
}
-->
</STYLE>
</HEAD>
<BODY>
<!-- Text associated with
same numbered images -->
<DIV id=Tx1
CLASS="pText" style="position: absolute; color: #F86060; top: 0;
left: 0; visibility: hidden; height: 50%; width: 30%; z-index: 1; padding:
5%"><FONT COLOR="#FF1493">
1ste foto of prent
</FONT></DIV>
<DIV id=Tx2
CLASS="pText" style="position: absolute; color: #F86060; top: 0;
left: 0; visibility: hidden; height: 50%; width: 30%; z-index: 1; padding:
5%"><FONT COLOR="#FF1493">
2de foto of prent
</FONT></DIV>
<DIV id=Tx3
CLASS="pText" style="position: absolute; color: #F86060; top: 0;
left: 0; visibility: hidden; height: 50%; width: 30%; z-index: 1; padding:
5%"><FONT COLOR="#FF1493">
3de foto of prent
</FONT></DIV>
<DIV id=Tx4
CLASS="pText" style="position: absolute; color: #F86060; top: 0;
left: 0; visibility: hidden; height: 50%; width: 30%; z-index: 1; padding:
5%"><FONT COLOR="#FF1493">
4de foto of prent
</FONT></DIV>
<!-- Images numbered in
sequence -->
<DIV id=d1
style="POSITION: absolute; TOP: 0; LEFT: 0; WIDTH: 300; HEIGHT: 200;
z-index:2">
<IMG id=pic1 src=" c:\image\wet\herfst.jpg "
style="POSITION: absolute; TOP: 0; LEFT: 0; height: 100%; width: 100%;
visibility: hidden">
</DIV>
<DIV id=d2
style="POSITION: absolute; TOP: 0; LEFT: 0; WIDTH: 300; HEIGHT: 200;
z-index:3">
<IMG id=pic2 src=" c:\image\wet\herfst.jpg "
style="POSITION: absolute; TOP: 0; LEFT: 0; height: 100%; width: 100%;
visibility: hidden">
</DIV>
<DIV id=d3
style="POSITION: absolute; TOP: 0; LEFT: 0; WIDTH: 300; HEIGHT: 200;
z-index:4">
<IMG id=pic3 src=" c:\image\wet\herfst.jpg "
style="POSITION: absolute; TOP: 0; LEFT: 0; height: 100%; width: 100%;
visibility: hidden">
</DIV>
<DIV id=d4
style="POSITION: absolute; TOP: 0; LEFT: 0; WIDTH: 300; HEIGHT: 200;
z-index:5">
<IMG id=pic4 src=" c:\image\wet\herfst.jpg "
style="POSITION: absolute; TOP: 0; LEFT: 0; height: 100%; width: 100%;
visibility: hidden">
</DIV>
<DIV id=d5
style="POSITION: absolute; TOP: 0; LEFT: 0; WIDTH: 300; HEIGHT: 200;
z-index:10)">
<IMG id=pic5 src=" c:\image\wet\herfst.jpg "
style="POSITION: absolute; TOP: 0; LEFT: 0; width: 100%; height: 100%;
visibility: hidden">
</DIV>
<!-- Closing page -->
<DIV id=Tx5
style="POSITION: absolute; TOP: 0; LEFT: 0; WIDTH: 300; HEIGHT: 200;
visibility: hidden; z-index: 2">
<DIV style="padding:
5%">
<FONT SIZE="3"
COLOR="#8F1443"><CENTER>
<p>weer een script</p>
<p>sla het op als
xxxx.htm in een map </p>
<p>en pas achter IMG
id=pic1 src="XXXXXXXXX" </p>
<p>aan met je eigen
plaatje</p>
<p>zo ook pic 2-3-4-5,
neem wel plaatjes van w300 x h200</p>zoek
de tekst op en verander hem.(in de bron)
</CENTER></FONT></DIV>
</DIV>
<!-- Title Page -->
<DIV id=greet
style="position:absolute;top:0;left:0;visibility:hidden;filter:RevealTrans(Duration=4,Transition=3)">
<center>
Hallo,<br>Ga naar "beeld"<br>en “bron”...
</center>
</DIV>
<!-- MIDI Love Is
Life_(Toshikazu_Sugama) -->
<IMG id=midi
src="Love_Is_Life.MID" style="display: none">
<SCRIPT
language="VBScript">
Dim w,
wW, wH, Res, myTimer, pW, pH, count, p, numPics, Lh, Lw, Lt, Ll, Ldh, Ldw, Ldt,
Ldl, resizeFlag
Dim L(5), T(5), b1(5), b2(5),
b3(5), b4(5), mL(5), mT(5)
Set w=document.body
' Initialize
sub setUp()
ClearTimeOut(myTimer)
' Window dimensions
wW=w.offsetWidth
wH=w.offsetHeight
resizeFlag=0
Lh=.5*wH
Lw=.33*wW
Lt=.25*wH
Ll=.33*wW
Ldh=(wH-Lh)/50
Ldw=(wW-Lw)/50
Ldt=Lt/50
Ldl=Ll/50
' Final Left coordinates for images
L(1)=0:L(2)=wW*.66:L(3)=0:L(4)=wW*.66:L(5)=wW*.33
' Final Top coordinates for images
T(1)=0:T(2)=0:T(3)=wH*.5:T(4)=wH*.5:T(5)=wH*.25
' Set transition with script so it functions right
' Make these divs full screen
Tx5.style.width="100%"
Tx5.style.height="100%"
' This div will be on top initially
d5.style.zindex="10"
greet.style.top=wH*.3
' Total number of small images
numPics=5
for i=1 to numPics
' Starting position for images
document.all("d"&i).style.left=wW*.33
document.all("d"&i).style.top=wH*.25
' and text.
if i<numPics then
document.all("Tx"&i).style.left=L(i)
document.all("Tx"&i).style.top=T(i)
else
document.all("Tx"&i).style.left=0
document.all("Tx"&i).style.top=0
document.all("Tx"&i).style.fontSize=12
end if
' Set Images initial size
document.all("d"&i).style.width=wW*.33
document.all("d"&i).style.height=wH*.5
' Insert the Transition filter in the div
document.all("d"&i).style.filter="RevealTrans
(Duration=4.0)"
' Set transition with script so it functions
right
document.all("d"&i).filters(0).transition=12
' Initially images are hidden
document.all("pic"&i).style.visibility="hidden"
document.all("Tx"&i).style.visibility="hidden"
b1(i)=INT(document.all("d"&i).style.posleft)
b2(i)=INT(L(i))
b3(i)=INT(document.all("d"&i).style.postop)
b4(i)=INT(T(i))
mL(i)=ABS((b1(i)-b2(i))/30)
mT(i)=ABS((b3(i)-b4(i))/30)
next
' Start count for slide-show = 1st image number-1
count=0
intro
end sub
' Open the Title Page
sub intro()
ClearTimeOut(myTimer)
greet.filters(0).Transition="3"
greet.filters(0).Apply()
greet.style.visibility="visible"
greet.filters(0).Play()
myTimer=SetTimeOut("startShow",9000)
end sub
' Close the Title Page
sub startShow()
ClearTimeOut(myTimer)
greet.filters(0).Transition="2"
greet.filters(0).Apply()
greet.style.visibility="hidden"
greet.filters(0).Play()
myTimer=SetTimeOut("doShow",6000)
end sub
' Main program loop
sub doShow()
ClearTimeOut(myTimer)
greet.style.visibility="hidden"
if resizeFlag=1 then
myTimer=SetTimeOut("setUp",200)
' Get next image
count=count+1
' Done all small images?
if count<=numPics then
' No
if count<numPics then
document.all("Tx"&count).style.visibility="visible"
p="d"&count
' Display the image with the transition
document.all(p).filters(0).Apply()
document.all("pic"&count).style.visibility="visible"
document.all(p).filters(0).Play()
myTimer=SetTimeOut("moveIt",6000)
else
myTimer=SetTimeOut("doneIt",4000)
end if
end sub
' Final message display
sub doneIt()
ClearTimeOut(myTimer)
if Lt>0 then
Lh=Lh+Ldh
Lw=Lw+Ldw
Lt=Lt-Ldt
Ll=Ll-Ldl
d5.style.height=Lh
d5.style.width=Lw
d5.style.top=Lt
d5.style.left=Ll
myTimer=SetTimeOut("doneIt",2)
else
' Hide all the small images and text
for i=1 to numPics-1
document.all("pic"&i).style.visibility="hidden"
document.all("Tx"&i).style.visibility="hidden"
next
' Make final message visible but it is still
' behind the large image.
Tx5.style.visibility="visible"
' Move the large image behind the message.
d5.style.zindex="-1"
' Re-start the show after 20 seconds.
myTimer=SetTimeOut("setUp",20000)
end if
end sub
' Move small image to final
position, over the text.
sub moveIt()
ClearTimeOut(myTimer)
' Has image finished moving yet?
if b1(count)<>b2(count) or
b3(count)<>b4(count) then
' No, so move it a bit more.
if b1(count)>b2(count) then
b1(count)=INT(b1(count)-mL(count))
if b1(count)<b2(count) then
b1(count)=INT(b1(count)+mL(count))
if b3(count)<b4(count) then
b3(count)=INT(b3(count)+mT(count))
if b3(count)>b4(count) then
b3(count)=INT(b3(count)-mT(count))
document.all(p).style.top=b3(count)
document.all(p).style.left=b1(count)
' Check to see if finished moving.
myTimer=SetTimeOut("moveIt",80)
else
' Image positioned so get the next one.
myTimer=SetTimeOut("doShow",2)
end if
end sub
' Everything starts here
sub Window_OnLoad()
' No scrollbar needed
w.scroll="no"
setUp
end sub
' This runs if the window size
is changed.
sub Window_OnResize()
resizeFlag=1
end sub
' Play midi - should work for
both OE4 and OE5
document.writeln "<BGSOUND loop=99
src="&midi.src&">"
</SCRIPT>
</BODY>
</HTML>