Ich hab da ma ne frage. wenn ich auf diese Seite hier gehe http://www.conanundco.net/ und oben auf Podcast gehe erscheint so ein kleines Einblendfenster. Wie Programmiere ich das um so ein Fenster für meine Homepage benutzen zu können? Und wie mache ich ein Backup von meiner Aktuellen Homepage die ein CMS System ist?
Fenster Script und CMS Backup
-
-
weiß hier keiner wie das geht?
-
ok, is eigentlich ganz einfach. des "popup" ist n normaler div-container.
hat allerdings als hintergrund ein leicht transparentes bild. beim klick auf
den button wird ein javascript angesteuert, dass den container sichtbar
macht (css eigenschaft -> display). dadurch muss die seite nicht neu
geladen werden (und erweckt den effekt eines popups). -
jetzt muss mir nur noch ein erklären wie ich das progrmmiere oder einer gibt mir bitte nen quelltext
-
Sieh' dir doch den Quellcode von der Seite an...
-
hab noch eine frage muss ich das jedesmal programmieren? hatte vor wenn man bei mir auf nen bild klickt das dann das bild in diesen popup kommt in original größe. und woher bekomme ich die css style sheats datei?
-
-
wie es aussieht kann mein cms system das nicht oder hab ich was vergessen?
-
das ist css. du musst noch den div-container erstellen, welchen
die css-eigenschaften anpassen. css sollte eigentlich jedes cms
können.wennst keine ahnung von div und css hast -> selfhtml.org
-
aber muss ich das für jedes bild dann einzeln programmieren?
was dabei rauskommt ist dies hier: http://dragonball17.dr.funpic.de/include.php?pa…hp&contentid=53
und dazu der quelltext:
ZitatAlles anzeigenelement.style {
display:block;
height:315px;
left:300px;
position:absolute;
top:35px;
width:360px;
}#screenshots #screenshot2 {
background:transparent url(http://www.conanundco.net/images/podcast_back.png) no-repeat scroll 0 0;<div style="float:left; margin-right:20px;">
<span style="display:block;" style="font-size: 1.8em">Dragonball Z<br>Legendäre Superkämpfer</span>
<img src="images/Cover/Videospiele/GBC/616QRKKMZ5L__SS500_.jpg" style="width:150px; height:150px;"/><span style="clear:both;"></span>
<a href=""></a>
</div> -
hm... nein. du könntest beim aufruf übers js (onclick) nicht
nur die id übergeben (welcher div angezeigt werden soll),
sondern auch den dateinamen. den dann im js via css als
background einbinden... -
versteh ich nicht. aber im mom klappt das nicht siehe meinen letzten post auf seite 1
-
sorry, kenn mich mit deinem cms nicht aus...
du schreibst momentan den quelltext direkt in html rein.
deshalb wird des ganze als text erkannt, nicht als css.entweder musst du irgendwo ne *.css finden und des dort
dann einfügen oder des css-zeug zwischen <style type="text/css">
und </style> hängen... eigentlich alles css grundwissen... -
sieht schon besser aus aber es erscheint noch nicht als popup fenster wie auf der einen seite
-
du hast auch kein javascript drin. auf der seite wird der div-container erst
als display:none markiert (also unsichtbar). bei klick auf den button oben
wird ein javascript ausgeführt, welches den display-wert auf "block" setzt. -
welchen button meinst du? und wie mache ich javascript darein?
-
im original is doch oben ein button (glaub steht podcast drauf). wenn du dort
drauf klickst, kommt das "popup". hinter diesem button liegt ein javascript, dass..
ach warum erzähl ich des nochmal... lies meinen ersten post !das liegt hinter dem button
screenshot2 is die id von der div-box. aufgerufen wird die
function "show". diese ist so verankert:es wird praktisch der div-container über die übergebene id
herangezogen, und dann dessen css-wert "display" geändert
von "none" (unsichtbar) in "block" (wird also sichtbar).wie du in deinem cms js einbindest... ich nehm an indem du
den teil als js markierst -
kannst du mir bitte bitte ein beispiel code machen wie sowas in allen aussehen sollte?
Die Bilder will ich als Popup http://dragonball17.dr.funpic.de/include.php?pa…hp&contentid=51
-
von was ? oben is doch alles erklärt....zudem kenn ich mich mit deinem cms
nicht aus (wie schon oft erwähnt). ich beschreibs dir jetzt mal wie ichs in nem
normalen html-dokument machen würde...im head:
die css definition + das javascript
also des <style... und des <script...
in des style-teil kommt die css definition,
in das script-teil die function show (...in body
den div-container ganz oben hin (die position wird
definiert durch die angaben im css)und hinter dem menüpunkt, den du als button definieren
willst, der dein popup öffnet, legst das onclick-element.bisserl was selbst musst auch machen. wir ham dir jetzt alle
tips gegeben. nun setzt dich hin und testest selber mal,
wenns nicht klappt, kannst deinen code hier posten und wir
schauen dann wo die evtl probleme sind... -
HTML
Alles anzeigen<html> <head> <style type="text/css"> element.style { display:block; height:315px; left:300px; position:absolute; top:35px; width:360px; } </style> <script language="JavaScript" type="text/JavaScript"> <!-- function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x; } function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; } function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} } //--> #screenshots #screenshot2 { background:transparent url(http://www.conanundco.net/images/podcast_back.png) no-repeat scroll 0 0; onclick="show('images/Bilder/Videogames/DBZBT2PS2Wii/unbenannt.jpg');return false;" function show(layer) { document.getElementById(layer).style.display='block'; </script> </head> <body> <div style="float:left; margin-right:20px;"> <span style="display:block;" style="font-size: 1.8em"></span> <img src="images/Bilder/Videogames/DBZBT2PS2Wii/unbenannt.jpg" style="width:150px; height:100px;"/><span style="clear:both;"></span> </div> </body> </html>So in etwa?
-