Avatar billede lbknudsen Praktikant
22. august 2007 - 11:10 Der er 6 kommentarer og
1 løsning

Image rotate

Jeg er ansvarlig for afdelingens intranetside. Siden er baseret på Sharepoint, men muligheden er der jo for at programmere i HTML i stedet.
Hvorledes - i html - laves muligheden for at skifte et billede på en side f.eks. hvert 30. sek.? Jeg har fået et javascript, der kan gøre det, men det er vel ikke kompatibelt med html?
Avatar billede weis Nybegynder
22. august 2007 - 11:13 #1
JavaScript virker fint sammen med html...!
Avatar billede jweber Nybegynder
22. august 2007 - 11:19 #2
Du skal bruge Javascript, HTML er kun til opsætning og ikke andet.
Avatar billede lbknudsen Praktikant
22. august 2007 - 11:37 #3
Hvordan skal det så sættes ind? Det efterfølgende er koden til et billede, hvor denne feature evt. skulle bruges. Hvor smides scriptet ind (kommer sidst)?
<P align=center><IMG style="BORDER-LEFT-COLOR: #87ceeb; BORDER-BOTTOM-COLOR: #87ceeb; WIDTH: 211px; BORDER-TOP-COLOR: #87ceeb; HEIGHT: 149px; BORDER-RIGHT-COLOR: #87ceeb" height=149 alt="" hspace=0 src="/C6/C7/Group%20HSE/HSE%20Pixs/20050908-1006.jpg" width=211 border=2 longDesc="" editorID="MiddleLeftZoneTopMiddle66_g_17bf6a87_6eb8_4bb0_9f08_55687d43477c_editor1">

java script:
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var interval = 3.5; // delay between rotating images (in seconds)
var random_display = 1; // 0 = no, 1 = yes
interval *= 1000;

var image_index = 0;
image_list = new Array();
image_list[image_index++] = new imageItem("http://picture 1.jpg");
image_list[image_index++] = new imageItem("http://picture 2.jpg");
image_list[image_index++] = new imageItem("http://picture 3.jpg");

var number_of_image = image_list.length;
function imageItem(image_location)
{
this.image_item = new Image();
this.image_item.src = image_location;
}
function get_ImageItemLocation(imageObj) {
return(imageObj.image_item.src)
}

function generate(x, y)
{
var range = y - x + 1;
return Math.floor(Math.random() * range) + x;
}

function getNextImage()
{
if (random_display)
{
image_index = generate(0, number_of_image-1);
}
else
{
image_index = (image_index+1) % number_of_image;
}
var new_image = get_ImageItemLocation(image_list[image_index]);
return(new_image);
}
function rotateImage(place)
{
var new_image = getNextImage();
document[place].src = new_image;
var recur_call = "rotateImage('"+place+"')";
setTimeout(recur_call, interval);
}
//  End -->
</script>

<BODY OnLoad="rotateImage('rImage')">
<center>
<table border="0" id="table1">
<tr>
<td>
<p align="center">
<img name="rImage" src="http://xxxxx.net/sites/SIS/SIS%20pictures/Forms/DispForm.aspx?ID=31&RootFolder=%2fsites%2fSIS%2fSIS%20pictures%2fStaff/SISS Staff15.jpg" width=180 height=120></td></tr>
</table>
</center>
</body>
Avatar billede weis Nybegynder
22. august 2007 - 18:29 #4
hvis det ikke er et krav at bruge det script du har der, så prøve dette. Skulle virke, du skal bare ændre stien til billederne!

<html>
<head>
<title>Slideshow</title>
<script>
var slideShowSpeed = 5000

var crossFadeDuration = 3

var Pic = new Array()

Pic[0] = '05.jpg'
Pic[1] = '02.jpg'
Pic[2] = '03.jpg'
Pic[3] = '04.jpg'

var t
var j = 0
var p = Pic.length

var preLoad = new Array()
for (i = 0; i < p; i++){
  preLoad[i] = new Image()
  preLoad[i].src = Pic[i]
}

function runSlideShow(){
  if (document.all){
      document.images.SlideShow.style.filter="blendTrans(duration=2)"
      document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)"
      document.images.SlideShow.filters.blendTrans.Apply()     
  }
  document.images.SlideShow.src = preLoad[j].src
  if (document.all){
      document.images.SlideShow.filters.blendTrans.Play()
  }
  j = j + 1
  if (j > (p-1)) j=0
  t = setTimeout('runSlideShow()', slideShowSpeed)
}
</script>
</head>

<body onload="setTimeout('runSlideShow()', slideShowSpeed)"> 
<img src="04.jpg" name='SlideShow'>
</body>
</html>
Avatar billede lbknudsen Praktikant
23. august 2007 - 09:15 #5
Weis: Jeg takker, men har lige et spørgsmål mere, som ikke blev besvaret. Her er et billede på en hjemmeside:
<P align=center><IMG style="BORDER-LEFT-COLOR: #87ceeb; BORDER-BOTTOM-COLOR: #87ceeb; WIDTH: 211px; BORDER-TOP-COLOR: #87ceeb; HEIGHT: 149px; BORDER-RIGHT-COLOR: #87ceeb" height=149 alt="" hspace=0 src="/C6/C7/Group%20HSE/HSE%20Pixs/20050908-1006.jpg" width=211 border=2 longDesc="" editorID="MiddleLeftZoneTopMiddle66_g_17bf6a87_6eb8_4bb0_9f08_55687d43477c_editor1">

Billedet (/C6/C7/Group%20HSE/HSE%20Pixs/20050908-1006.jpg)skal vel fjernes? Hvorledes vil min lille kode se ud med dit script indarbejdet?
Avatar billede lbknudsen Praktikant
23. august 2007 - 15:38 #6
Jeg har nu fået løst "problemet". Næsten. Det virker nu i Frontpage, men så snart det overføres til Sharepoint, så vises udelukkende det sidste billede - i ovenstående "04.jpg". Nogen løsninger?
Avatar billede lbknudsen Praktikant
07. september 2007 - 13:13 #7
Lukker
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester