[x] Navigation

[x] Languages

[x] Design
Each user can view the site with a different theme.
Themes marked with a * also change the forum look.

[x] Downloads (Top)

Slidebanner anstelle von nur einem Bild
Alle Fragen über die Entwicklung und Bearbeitung von Templates.(Design, Theme, css)
Post new topic    Reply to topic    Printer Friendly Page     Forum Index ›  Templates und Design

View previous topic :: View next topic  
Author Message
Janusz87
Investigator
Investigator

Offline Offline
Joined: Apr 19, 2012
Posts: 11

PostPosted: 20.07.2012 19:50
Post subject: Slidebanner anstelle von nur einem Bild

Hallo Gemeinde,

ich habe folgendes Problem:

Ich hab auf der Forumsseite oben ein PotD : Pic of the Day
Darüber habe ich einen Text, darunter zwei Links und alles in einem Container hier ist der Code dazu:

<center>Null Poster werden gelöscht! User ohne Vorstellung werden spätestens nach 1 Monat wieder gelöscht.
</center><p></p>
<center>
<a href="http://www.uscartreffen.de/viewtopic.php?f=163&t=1910&sid=d8052a7af7c099d23eaf4e47493927ba"><img src="http://www.dr-mustang.com/modules/coppermine/albums/pic_of_the_day_3/201003/dr_2750.jpg"></a>
</center>
<p></p>
<marquee behavior="scroll" direction="left" scrollamount="4" scrolldelay="0">
<a href="http://www.uscartreffen.de/viewforum.php?f=163&sid=8c8272620b88a409b59ef820aa12c517"> :convertible: 9.US Car Treffen am CentrO Oberhausen 21./22.7.2012 :wave: </a>
</marquee><p></p>

<p></p>
<center>[url=LINK(nur als Beispiel)[/url]
</center>

<p></p>
<center>[url=LINK(nur als Beispiel)[/url]
</center>

<p></p>

Ich möchte nun anstelle von einem Bild ein Slidebanner haben, jedoch zerschießt mir mein erstellter Code mit Java Script die Seite, kann mir jemand von euch helfen ?

Hier der Code den ich anstelle vom Bild eingefügt habe:

<style>
body{
background-color:black;
padding:0;
margin:0;
with:320;
height:480;

}
img{
-webkit-transition-property:opacity;
-webkit-transition-duration: 3s;
position:absolute;
width: 320px;
height:auto;
}
img.fade-out{opacity:0}
img.fade-in{opacity:1}
</style>
<body>
<img src="images/image01.jpg"/>
<img src="images/image02.jpg"/>
<img src="images/image03.jpg"/>
<img src="images/image04.jpg"/>
<script>
var interval = 4 * 20; // Seconds between change
var images = document.getElementsByTagName("img");
var imageArray = [];
var imageCount = images.length;
var current = 0;

var randomize = function(){
return (Math.round(Math.random() * 3 - 1.5));
}
for(var i = 0; i < imageCount; i++){
images[i].className = 'fade-out';
imageArray[i] = images[i];
}
imageArray.sort(randomize);

var fade = function(){

imageArray[current++].className = 'fade-out';
if(current == imageCount){
current = 0;
imageArray.sort(randomize);
}
imageArray[current].className = 'fade-in';

setTimeout(fade, interval * 100);
};
fade();
</script>
</body>


Leider wie gesagt, wird mir der Slidebanner nicht angezeigt, genauso wie die restlichen Bilder riesig werden.

Kann mir jemand helfen ? Oder kennt jemand ein Modul oder ähnliches welches ich als Slidebanner nutzen kann ?

Gruß,
Jan


Janusz87's server specs (Server OS / Apache / MySQL / PHP / DragonflyCMS)
Linux/././.
Back to top
View user's profile
Ertan
Webmaster
Webmaster

Offline Offline
Joined: Mar 19, 2004
Posts: 1263
Location: Germany
PostPosted: 07.09.2012 14:27
Post subject: Re: Slidebanner anstelle von nur einem Bild

javascript immer in head
und es nutzt
Array:
 var images = document.getElementsByTagName("img");


img --> zu allgemein - betrifft dann alle images

bau doch ein jquery slide banner ein

anleitungen gibt es im netz genug

z.b slidesjs.com/ oder google

_________________
.: USE THE FORCE :.
Helft mit ! Keine Unbeantworteten Beiträge mehr

Ertan's server specs (Server OS / Apache / MySQL / PHP / DragonflyCMS)
Back to top
View user's profile Send e-mail Visit poster's website Photo Gallery
Display posts from previous:   
Post new topic    Reply to topic    Printer Friendly Page    Forum Index ›  Templates und Design
Page 1 of 1
All times are GMT + 1 Hour



Jump to:  


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum
You cannot attach files in this forum
You cannot download files in this forum




Interactive software released under GNU GPL, Code Credits, Privacy Policy