mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Sa 10.12.2016 14:18 Benutzername: Passwort: Auto-Login

Thema: [Javascript] Diashow script vom 28.08.2006


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> [Javascript] Diashow script
Seite: 1, 2  Weiter
Autor Nachricht
gonE
Threadersteller

Dabei seit: 28.08.2006
Ort: -
Alter: -
Geschlecht: -
Verfasst Mo 28.08.2006 22:40
Titel

[Javascript] Diashow script

Antworten mit Zitat Zum Seitenanfang

suche nen einfaches diashow script...

dh mit bildern die alle 3 sekunden wechseln. Allerdings soll das Script nicht immer von vorne anfangen wenn ich nen link oder refresh drücke...

Ohne weiter und zurück ...

thx


Zuletzt bearbeitet von gonE am Mo 28.08.2006 22:40, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
blueX

Dabei seit: 13.07.2006
Ort: Lüchow
Alter: 34
Geschlecht: Männlich
Verfasst Di 29.08.2006 03:50
Titel

Antworten mit Zitat Zum Seitenanfang

hm das es nach nem seiten reload nicht nochmal von forn anfängt wird schwer umsetzbar weil der browser sich sämmtliche informationen neu holt und dann anfängt die js scripte aus zu führen .. will heissen , wenn du einen link klickst der das aktuelle browserfenster neu läd, dann werden auch die scripte nochmal neu geladen und neu gestartet. die einzige möglichkeit die mir einfallen würde wäre eine arbeit mit deinem Cooki , bei dem jedes abgelaufene bild darin gespeichert wir ... zb die bild id und das js dann dort weiter mach wo es die letzte id eingetragen hat...... dabei ist allerdingst wieder da problem das nich alle user cookies akteptieren.......

ansonsten könnte man sowas evtl mit ajax umsetzen. so das man in der datenbank mit seiner sessionid und dem aktuellen dias bild gespeichert wird.... und überajax wird dann immer auf den server geguckt welches bild als nächstes dranne ist , geladen und auf dem server die bildid neu eingetragen....... soviel u meiner theorie ^^

also normal werden solche sachen wieder von forne beginnen.. aber letzt endlich ist eigendlich nichts unmöglich... die frage ist nur ob ein solcher aufwand auch gerechtfertigt ist....
  View user's profile Private Nachricht senden
Anzeige
Anzeige
gonE
Threadersteller

Dabei seit: 28.08.2006
Ort: -
Alter: -
Geschlecht: -
Verfasst Di 29.08.2006 20:29
Titel

Antworten mit Zitat Zum Seitenanfang

ich hatte mir schon überlegt mit sessions zu arbeiten... allerdings habe ich dann das problem, die javascript var in eine php var umzuwandeln.

dazu fehlt mir aber das wissen...

vllt weiss ja jmd wie sowas funktioniert...

würde mich aber auch freuen wenn mir jmd nen link schickt, der mich auf nen fertiges script mit nem random script verweist. ^^ es muss nur als diashow laufen sprich alle 3 sec das bild wechseln.

ist zwar nicht das gleiche aber habe dann auch andere bilde beim reload...

danke
  View user's profile Private Nachricht senden
Smoerrebroed

Dabei seit: 29.08.2006
Ort: -
Alter: -
Geschlecht: -
Verfasst Di 29.08.2006 20:42
Titel

Antworten mit Zitat Zum Seitenanfang

Here we go:

/***********************************************
* Ultimate Fade-In Slideshow (v1.5): © Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

var fadeimages=new Array()
//SET IMAGE PATHS. Extend or contract array as needed
fadeimages[0]=["img01.jpg", "", ""]
fadeimages[1]=["img02.jpg", "", ""]
fadeimages[2]=["img03.jpg", "", ""]
fadeimages[3]=["img04.jpg", "", ""]
fadeimages[4]=["img05.jpg", "", ""]
fadeimages[5]=["img06.jpg", "", ""]


var fadebgcolor="black"

////NO need to edit beyond here/////////////

var fadearray=new Array() //array to cache fadeshow instances
var fadeclear=new Array() //array to cache corresponding clearinterval pointers

var dom=(document.getElementById) //modern dom browsers
var iebrowser=document.all

function fadeshow(theimages, fadewidth, fadeheight, borderwidth, delay, pause, displayorder){
this.pausecheck=pause
this.mouseovercheck=0
this.delay=delay
this.degree=10 //initial opacity degree (10%)
this.curimageindex=0
this.nextimageindex=1
fadearray[fadearray.length]=this
this.slideshowid=fadearray.length-1
this.canvasbase="canvas"+this.slideshowid
this.curcanvas=this.canvasbase+"_0"
if (typeof displayorder!="undefined")
theimages.sort(function() {return 0.5 - Math.random();}) //thanks to Mike (aka Mwinter) Lächel
this.theimages=theimages
this.imageborder=parseInt(borderwidth)
this.postimages=new Array() //preload images
for (p=0;p<theimages.length;p++){
this.postimages[p]=new Image()
this.postimages[p].src=theimages[p][0]
}

var fadewidth=fadewidth+this.imageborder*2
var fadeheight=fadeheight+this.imageborder*2

if (iebrowser&&dom||dom) //if IE5+ or modern browsers (ie: Firefox)
document.write('<div id="master'+this.slideshowid+'" style="position:relative;width:'+fadewidth+'px;height:'+fadeheight+'px;overflow:hidden;"><div id="'+this.canvasbase+'_0" style="position:absolute;width:'+fadewidth+'px;height:'+fadeheight+'px;top:0;left:0;filter:progid:DXImageTransform.Microsoft.alpha(opacity=10);-moz-opacity:10;-khtml-opacity:10;background-color:'+fadebgcolor+'"></div><div id="'+this.canvasbase+'_1" style="position:absolute;width:'+fadewidth+'px;height:'+fadeheight+'px;top:0;left:0;filter:progid:DXImageTransform.Microsoft.alpha(opacity=10);-moz-opacity:10;background-color:'+fadebgcolor+'"></div></div>')
else
document.write('<div><img name="defaultslide'+this.slideshowid+'" src="'+this.postimages[0].src+'"></div>')

if (iebrowser&&dom||dom) //if IE5+ or modern browsers such as Firefox
this.startit()
else{
this.curimageindex++
setInterval("fadearray["+this.slideshowid+"].rotateimage()", this.delay)
}
}

function fadepic(obj){
if (obj.degree<100){
obj.degree+=10
if (obj.tempobj.filters&&obj.tempobj.filters[0]){
if (typeof obj.tempobj.filters[0].opacity=="number") //if IE6+
obj.tempobj.filters[0].opacity=obj.degree
else //else if IE5.5-
obj.tempobj.style.filter="alpha(opacity="+obj.degree+")"
}
else if (obj.tempobj.style.MozOpacity)
obj.tempobj.style.MozOpacity=obj.degree/101
else if (obj.tempobj.style.KhtmlOpacity)
obj.tempobj.style.KhtmlOpacity=obj.degree/100
}
else{
clearInterval(fadeclear[obj.slideshowid])
obj.nextcanvas=(obj.curcanvas==obj.canvasbase+"_0")? obj.canvasbase+"_0" : obj.canvasbase+"_1"
obj.tempobj=iebrowser? iebrowser[obj.nextcanvas] : document.getElementById(obj.nextcanvas)
obj.populateslide(obj.tempobj, obj.nextimageindex)
obj.nextimageindex=(obj.nextimageindex<obj.postimages.length-1)? obj.nextimageindex+1 : 0
setTimeout("fadearray["+obj.slideshowid+"].rotateimage()", obj.delay)
}
}

fadeshow.prototype.populateslide=function(picobj, picindex){
var slideHTML=""
if (this.theimages[picindex][1]!="") //if associated link exists for image
slideHTML='<a href="'+this.theimages[picindex][1]+'" target="'+this.theimages[picindex][2]+'">'
slideHTML+='<img src="'+this.postimages[picindex].src+'" border="'+this.imageborder+'px">'
if (this.theimages[picindex][1]!="") //if associated link exists for image
slideHTML+='</a>'
picobj.innerHTML=slideHTML
}


fadeshow.prototype.rotateimage=function(){
if (this.pausecheck==1) //if pause onMouseover enabled, cache object
var cacheobj=this
if (this.mouseovercheck==1)
setTimeout(function(){cacheobj.rotateimage()}, 100)
else if (iebrowser&&dom||dom){
this.resetit()
var crossobj=this.tempobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
crossobj.style.zIndex++
fadeclear[this.slideshowid]=setInterval("fadepic(fadearray["+this.slideshowid+"])",50)
this.curcanvas=(this.curcanvas==this.canvasbase+"_0")? this.canvasbase+"_1" : this.canvasbase+"_0"
}
else{
var ns4imgobj=document.images['defaultslide'+this.slideshowid]
ns4imgobj.src=this.postimages[this.curimageindex].src
}
this.curimageindex=(this.curimageindex<this.postimages.length-1)? this.curimageindex+1 : 0
}

fadeshow.prototype.resetit=function(){
this.degree=10
var crossobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
if (crossobj.filters&&crossobj.filters[0]){
if (typeof crossobj.filters[0].opacity=="number") //if IE6+
crossobj.filters(0).opacity=this.degree
else //else if IE5.5-
crossobj.style.filter="alpha(opacity="+this.degree+")"
}
else if (crossobj.style.MozOpacity)
crossobj.style.MozOpacity=this.degree/101
else if (crossobj.style.KhtmlOpacity)
crossobj.style.KhtmlOpacity=obj.degree/100
}


fadeshow.prototype.startit=function(){
var crossobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
this.populateslide(crossobj, this.curimageindex)
if (this.pausecheck==1){ //IF SLIDESHOW SHOULD PAUSE ONMOUSEOVER
var cacheobj=this
var crossobjcontainer=iebrowser? iebrowser["master"+this.slideshowid] : document.getElementById("master"+this.slideshowid)
crossobjcontainer.onmouseover=function(){cacheobj.mouseovercheck=1}
crossobjcontainer.onmouseout=function(){cacheobj.mouseovercheck=0}
}
this.rotateimage()
}

</script>
</head>

<body>

<script type="text/javascript">
//new fadeshow(IMAGES_ARRAY_NAME, slideshow_width, slideshow_height, borderwidth, delay, pause (0=no, 1=yes), optionalRandomOrder)
new fadeshow(fadeimages, 153, 88, 0, 3000, 0, "R")
</script>

</body>

Viel Spass damit!
  View user's profile Private Nachricht senden
torto

Dabei seit: 08.05.2003
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mi 02.04.2008 11:10
Titel

Antworten mit Zitat Zum Seitenanfang

Hallo,

gibt es eigentlich eine Möglichkeit die fade-Länge bei dem script einzustellen?

Grüße, Torto
  View user's profile Private Nachricht senden
combategg

Dabei seit: 27.07.2008
Ort: Varel
Alter: -
Geschlecht: -
Verfasst So 27.07.2008 13:33
Titel

Antworten mit Zitat Zum Seitenanfang

Ich hab selbst auch eine kleine API geschrieben, die eine einfache Diashow erzeugt.
Man kann einstellen, wie lange ein Fade dauern soll und wieviel Wartezeit zwischen den Bildern liegt, es kann der Reihe nach oder zufaellig die Bilder anzeigen. Schauts euch einfach mal an.

Dokumentation und Download gibts in meinem Blog-Artikel: imgFader - Bilder in JavaScript faden
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
m
Moderator

Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst So 27.07.2008 17:14
Titel

Antworten mit Zitat Zum Seitenanfang

combategg hat geschrieben:
eine kleine API geschrieben


*Huch*

Naja, hauptsache mal ein wenig Werbung gemacht.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
zweitaccount

Dabei seit: 25.01.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst So 27.07.2008 20:49
Titel

Antworten mit Zitat Zum Seitenanfang

m hat geschrieben:
combategg hat geschrieben:
eine kleine API geschrieben


*Huch*

Naja, hauptsache mal ein wenig Werbung gemacht.


öhm, ja und? * Keine Ahnung... *


Ich sag mal danke hier dafür. Wunderbares, kompaktes Script *Thumbs up!*
  View user's profile Private Nachricht senden
 
Ähnliche Themen Javascript MouseOver Script
[Script: JS] $_GET für Javascript
Mit JavaScript ein servergeneriertes Script unterdrücken.
Script zur Prüfung auf JavaScript gesucht
[Javascript] Hover und Aktiv Script
Javascript PopUp-Fenster Script -> Kompatiblität?
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2  Weiter
MGi Foren-Übersicht -> Programmierung


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.