[JavaScript] suche tutorial für javascript pictureshow

Patrone · 13. August 2007

suche tutorial für javascript pictureshow

wie gesagt... und sie muss dynamisch sein... soll später mal ne facharbeit werden...

Anzeige

Knusperkeks · 13. August 2007

AW: suche tutorial für javascript pictureshow

ist wohl eher webtechnik daher --> moved!

Knusperkeks

Cydoc · 13. August 2007

AW: suche tutorial für javascript pictureshow

Google gab mir sofort nen Link, der glaube nütlich ist.

http://www.lutz-nelde.de/Fremdscripte/JavaScript-Archiv/scripte2/pictureshow.htm

Quellcode kopieren (JS is opensource ) und dann bilder oben als array einfügen, ist glaube selbsterklärend....ansonsten guck dir die funktionen an, such bei google und du findest die erklärungen

mfg

Murdoc · 13. August 2007

AW: suche tutorial für javascript pictureshow

in wie fern dynamisch? ne bildergalerie kann man auch mit html machen.

zu javascript greift man wenn: man die bilder vergrößern/kleinern möchte (o.ä, bzw.: uvm).
zu php greift man wenn: man die bilder aus einer datenbank laden möchte (uvm).
zu javascript::ajax greift man wenn: man die bilder aus einer xml-datei laden möchte (uvm).

alle drei zusammen = unschlagbar

was muss deine galerie können?

zum topic: such nicht nach nem pictureshow kram, sondern nach nem javascript tutorial

FlowFlo · 13. August 2007

AW: suche tutorial für javascript pictureshow

Lightbox 2

Patrone · 13. August 2007

AW: suche tutorial für javascript pictureshow

es soll einfach nur bilder aus verschiedenen odnern laden, also wenn ich nen neuen ordner auf den sever lade solls dynamisch die bildershow erweitern. es soll eine bildvorschau geben, und bei klick solln sie groß werden.

das wars schon. die soll ich in javascript schreiben.

Telefonzelle · 14. August 2007

AW: suche tutorial für javascript pictureshow

Seit wann kann man mit JavaScript 'n Ordner auslesen? Hab ich was verpasst?

Patrone · 14. August 2007

AW: suche tutorial für javascript pictureshow

naja so habe ich das jedenfall verstanden... der lehrer fing auf die art sowas an. er sage wenn neue bilder kommen solln die sofort mit eingebunden werden können ohne aufwand. das is für mich dynamisch...

Murdoc · 14. August 2007

AW: suche tutorial für javascript pictureshow

javascript kann keine ordner auslesen.
und wenn das ding sofort merken muss wenn neue bilder da sind würd ich eher an php denken als an javascript.
frag deinen lehrer lieber nochmal.

Patrone · 14. August 2007

AW: suche tutorial für javascript pictureshow

vll meinte er das ja auch anders... ich hab bloß keine möglichkeit mehr ihn zu fragen nach den ferien muss ich abgeben...^^ vll soll das bloß so unkompliziert wie möglich sein wenn neue bilder kommen.

Murdoc · 14. August 2007

AW: suche tutorial für javascript pictureshow

und du bist auch ganz alleine in der klasse und kannst niemanden fragen?
-.-

Patrone · 14. August 2007

AW: suche tutorial für javascript pictureshow

bei uns kann leider keiner aus der klasse javascript... ich bin der einzigste der javascript als facharbeit angenommen hat...

Murdoc · 14. August 2007

AW: suche tutorial für javascript pictureshow

wieso ? javascript ist doch super!
naja was solls, ich schau mal wie weit ich sowas hinbekomme mit javascript, denn brauchbar is es allemal.

was du versuchen kannst ist mit ajax zu arbeiten und die bilder aus einer xmldatei zu holen, denn anders kann ich mir nicht vorstellen die bilder zu 'erfassen'. dazu musst du aber die bilder in die xml-datein eintragen, was aber nicht sehr schwer ist.

Telefonzelle · 14. August 2007

AW: suche tutorial für javascript pictureshow

Wobei man dann ja auch gleich die Bilder als Array direkt in JS eintragen könnte.

Murdoc · 14. August 2007

AW: suche tutorial für javascript pictureshow

sicher, aber von der bedienbarkeit ist ein arbeiten mit xml daten besser, immerhin musst man bei dir dann jedes mal im quelltext das array suchen und ewig erweitern, so hab ich eine xml-datei für: "bilder von hier und da", "bilder von urlaub blablabla" und wenn ich neue bilder hab, leg ich ne neue xmldatei an und kann zusätzlich noch nen kommentar, ein datum, wasauchimmer dazuspeichern.

Patrone · 14. August 2007

AW: suche tutorial für javascript pictureshow

das klingt ganz gut, das wäre vll schon mal ne recht gute lösung... allerdings hab ich noch genauso wenig mit xml dateien gearbeitet. bin da kompletter neuling. kann html und gaaanz wenig javascript...

Murdoc · 14. August 2007

AW: suche tutorial für javascript pictureshow

also ich hab mich da jetzt drangesetzt und das erste ergebnis fertig, evt kannst du das ja weiter ausbauen, ansonsten sag bescheid dann schau ma weiter, a bissl was leisten sollst du auch

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script language="javascript" type="text/javascript">
<!--
 //config
 var cols = 5; //wie viele bilder sollen nebeneinander angezeigt werden bis eine neue zeile beginnt
 
 function isInt(value) {
 if(!isNaN(value)) {
 value = String(value);
 var t = value.split('.');
 if(typeof t[1] != 'undefined') return false;
 else return true;
 }
 else return false;
 }
 
 // image-slideshow ajax object (xml request)
 function ajax() {
 var request;
 
 this.open = function() {
 request = false;
 if (window.XMLHttpRequest) {
 request = new XMLHttpRequest();
 if (request.overrideMimeType) request.overrideMimeType('text/xml'); //ja wir brauchen eine valide xml
 }
 else if (window.ActiveXObject) {
 try {
 request = new ActiveXObject("Msxml2.XMLHTTP");
 }
 catch (e) {
 try {
 request = new ActiveXObject("Microsoft.XMLHTTP");
 }
 catch (e) {}
 }
 }
 
 if(request == false) alert('error, can not start a xmlrequest! maybe your browser dont support this or the coder (i) was coding some crap!');
 }
 
 this.getxml = function(xmlnum) {
 if(typeof request != 'object') alert('error, need a xmlobject!');
 else {
 document.getElementById('img_content').innerHTML = 'Lade Bilder, bitte warten...';
 try {
 if(request.open('GET', './pics/bilder_'+xmlnum+'.xml', true) == false) alert('error, can not open xml!');
 else {
 request.send(null);
 request.onreadystatechange = this.handle;
 }
 }
 catch(e) { alert('error, page not found (404)!'); }
 }
 }
 
 this.handle = function() {
 if (request.readyState == 4) {
 if (request.status == 200) {
 var element = document.getElementById('img_content');
 var xmldat = request.responseXML;
 var img_names = xmldat.getElementsByTagName('bildname');
 var img_elements = xmldat.getElementsByTagName('bildlink');
 var img_comments = xmldat.getElementsByTagName('kommentar');
 var img_dates = xmldat.getElementsByTagName('datum');
 var output = '<table cellpadding="4" cellspacing="4" width="100%"><tr>';
 for(var i=0; i<img_elements.length; i++) {
 var picname = img_names.item(i).firstChild.data;
 var picsrc = img_elements.item(i).firstChild.data;
 var piccom = img_comments.item(i).firstChild.data;
 var picdate = img_dates.item(i).firstChild.data; 
 
 if(isInt(i/cols)) output += '</tr><tr>';
 output += '<td align="center"><b>'+picname+'</b><br/><img src="'+picsrc+'" alt="'+picname+'" /><br/><b>Kommentar: </b>'+piccom+'<br/><b>Eingetragen am: </b>'+picdate+'</td>';
 }
 
 output += '</tr></table>';
 element.innerHTML = output;
 }
 }
 }
 }
 
 var ajax = new ajax();
//-->
</script>
</head>
<body onload="ajax.open();">
 <h1>Meine Javascriptbildergalerie</h1><br/>
 <div id="img_content">Keine Gallerie geladen</div>
 <p align="center">
 <noscript>Du musst Javascript einschalten, sonst kann die Gallerie nicht funkionieren!</b><br/></noscript>
 <b>Meine Gallerien</b>
 <a href="#" onclick="ajax.getxml('1'); return false;">Test</a>
 </p>
</body>
</html>

das ganze muss auf nem webserver laufen und du musst einen ordner anlegen names "pics" und da drinnen deine xml-sachen speichern mit namen "bilder_*.xml"
* = fortlaufende nummer

xmldatei beispiel:

HTML:

<?xml version="1.0" encoding="UTF-8"?>
<root>
<!-- bild 1 -->
 <bildname>test</bildname>
 <bildlink>http://board.raidrush.ws/customavatars/avatar18622_5.gif</bildlink>
 <kommentar>test test</kommentar>
 <datum>14.09.2007</datum>
<!-- /bild 1 -->

<!-- bild 2 -->
<!-- [...] -->
<!-- /bild 2-->
</root>

läuft im übrigen auf anhieb im mozilla und ie, was mich doch sehr verwundert hatte

Patrone · 14. August 2007

AW: suche tutorial für javascript pictureshow

ehy geil, vielen dank ehy! das schau ich mir jetzt in ruhe an schreib in paar erklärungen und baus vll noch in bisschen aus.

VIELEN DANK!!! BW Habt ihr alle!

Murdoc · 15. August 2007

AW: suche tutorial für javascript pictureshow

hier ein wenig erweitert:

jeder, außer der threadstarter, kann mir ne pn schicken und bekommt den source

updates:
- einzelansicht
- bild verkleinern bei übersicht

beim ie hatte ich zu anfangs keine probleme, aber mit der zeit verweigerte der immer mehr den dienst. anfangs dacht ich der kommt mit mehrern anfragen ned zurecht (deswegen die variable 'stop' die nochmaligens anfordern von xml-datein unterbindet solange er noch läd, aber daran lags nicht) naja, wenn jemand lust hat kann ers erweitern umbaun was auch immer, wär doch mal ne idee so ein gemeinschafts projekt.

Patrone · 15. August 2007

AW: suche tutorial für javascript pictureshow

wieso ich nicht? würde auch gern mal die neuere version sehen.

Telefonzelle · 15. August 2007

AW: suche tutorial für javascript pictureshow

Wahrscheinlich weil's deine Facharbeit/Hausaufgabe ist und du das selber lösen sollst.

Nützliche Suchen

[JavaScript] suche tutorial für javascript pictureshow

Videos zum Themenbereich