Das Forum der Foren
Willkommen im offiziellen Supportforum von Forumieren!

Um alle Vorteile unseres Forums zu nutzen, melden Sie sich bitte an. Wenn Sie bereits Mitglied sind loggen Sie sich ein.


Erstellen Sie ein kostenloses Forum wie dieses hier.
Forenaustausch

Alle Anzeigen ansehen

Regeln und nützliche Hinweise
Lexi Help
Die neuesten Themen
» [phpBB3] Schlüsselwörter Keywords Anzahl
von Mazacre Gestern um 16:56

» [#10397][phpBB3] Verschobene Werbung auf allen Seiten
von Bigtuber Gestern um 16:35

» [phpBB3] Standard für Beitragseingabe?
von Bigtuber Gestern um 16:26

» [#10418] meine Mailadresse ändern und Auswirkungen auf servimg
von Kellytime Gestern um 13:31

» Arcania - High-Fantasy-RPG
von Sheep007 Mi 26 Jul 2017 - 20:10

» [phpBB3] Profile mit mehreren Icons?
von inde Di 25 Jul 2017 - 19:39

» [#10378] Guthaben mit Paypal bezahlt und nach 2 Tagen nicht in der Guthabenverw
von inde Mo 24 Jul 2017 - 16:47

» World-of-Horses
von inde So 23 Jul 2017 - 16:56

» Yorkshire Terrier Forum
von inde So 23 Jul 2017 - 16:55

» Hundeforum unter hundis.frei-forum.com
von inde So 23 Jul 2017 - 16:53

» Das Raubtierreich - Das Haustier-Talk- und Fotografie-Forum
von Emily Stein So 23 Jul 2017 - 15:22

» Naruto - SnK
von Aiko-Chan So 23 Jul 2017 - 12:07

» Weimaraner-Forum "Der vielseitige Weimaraner"
von Emily Stein So 23 Jul 2017 - 1:57

» My-Ponyclub
von Emily Stein So 23 Jul 2017 - 1:54

» Pflanzen-Samentauschbörse
von Emily Stein So 23 Jul 2017 - 1:54

» [Warrior Cats] FlammenClan
von Emily Stein So 23 Jul 2017 - 1:44

www.forumieren.de

[phpBB2] Slideshow nicht richtig angezeigt

Vorheriges Thema anzeigen Nächstes Thema anzeigen Nach unten

Erledigt [phpBB2] Slideshow nicht richtig angezeigt

Beitrag von Rush_Hour am So 4 Aug 2013 - 19:37

Hallo, ich bins mal wieder.

Ich probiere gerade ein bisschen in meinem Probeforum herum: http://probe-dustcity.forumieren.com/
Nachdem die Sache mit den Tabs jetzt funktioniert hat wollte ich mich mal an der Slideshow versuchen. Ich habe mich nach dem (sehr hilfreichen) Tutorial (für das ich sehr dankbar war) durch alles durch gehangelt, zwei Testbilder eingesetzt und den vorgegebenen Code in die Nachricht eingefügt.

Der sieht so aus:

Code:
   <iframe src="http://probe-dustcity.forumieren.com/h2-slideshow" width="99%" height="350" frameborder="0" scrolling="no"></iframe>

Der fertige Code in meiner html-Seite sieht so aus:

Code:
<!DOCTYPE html>
<html lang="de">
<head>
   <meta charset="utf-8">
  <style type="text/css">
 
 /*
   Resets defualt browser settings
   reset.css
*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td { margin:0; padding:0; border:0; outline:0; font-weight:inherit; font-style:inherit; font-size:100%; font-family:inherit; vertical-align:baseline; }
:focus { outline:0; }
a:active { outline:none; }
body { line-height:1; color:black; background:white; }
ol,ul { list-style:none; }
table { border-collapse:separate; border-spacing:0; }
caption,th,td { text-align:left; font-weight:normal; }
blockquote:before,blockquote:after,q:before,q:after { content:""; }
blockquote,q { quotes:"" ""; }

/*
   Page style
*/

body {
        background-color: transparent;
   font:normal 62.5%/1.5 Helvetica, Arial, sans-serif;
   letter-spacing:0;
   color:#434343;
   top center;
   position:relative;
   text-shadow:0 1px 0 rgba(255,255,255,.<img src="http://illiweb.com/fa/i/smiles/icon_cool.gif" alt="Cool" longdesc="6" />;
   -webkit-font-smoothing: subpixel-antialiased;
}

#container {
   width:580px;
   padding:10px;
   margin:0 auto;
   position:relative;
   z-index:0;
}

#example {
   width:600px;
   height:350px;
   position:relative;
}

#frame {
   position:absolute;
   z-index:0;
   width:739px;
   height:341px;
   top:-3px;
   left:-80px;
}

/*
   Slideshow
*/

#slides {
   position:absolute;
   top:15px;
   left:4px;
   z-index:100;
}

/*
   Slides container
   Important:
   Set the width of your slides container
   Set to display none, prevents content flash
*/

.slides_container {
   width:570px;
   overflow:hidden;
   position:relative;
   display:none;
}

/*
   Each slide
   Important:
   Set the width of your slides
   If height not specified height will be set by the slide content
   Set to display block
*/

.slides_container a {
   width:570px;
   height:270px;
   display:block;
}

.slides_container a img {
   display:block;
}

/*
   Next/prev buttons
*/

#slides .next,#slides .prev {
   position:absolute;
   top:107px;
   left:-39px;
   width:24px;
   height:43px;
   display:block;
   z-index:101;
}

#slides .next {
   left:585px;
}

/*
   Pagination
*/

.pagination {
   margin:26px auto 0;
   width:100px;
}

.pagination li {
   float:left;
   margin:0 1px;
   list-style:none;
}

.pagination li a {
   display:block;
   width:12px;
   height:0;
   padding-top:12px;
   background-image:url("http://i43.servimg.com/u/f43/17/63/75/60/pagina10.png");
   background-position:0 0;
   float:left;
   overflow:hidden;
}

.pagination li.current a {
   background-position:0 -12px;
}

/*
   Footer
*/

#footer {
   text-align:center;
   width:580px;
   margin-top:9px;
   padding:4.5px 0 18px;
   border-top:1px solid #dfdfdf;
}

#footer p {
   margin:4.5px 0;
   font-size:1.0em;
}

/*
   Anchors
*/

a:link,a:visited {
   color:#599100;
   text-decoration:none;
}

a:hover,a:active {
   color:#599100;
   text-decoration:underline;
}
 
</style>

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
   <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
<script type="text/javascript">
 
(function(a){a.fn.slides=function(b){return b=a.extend({},a.fn.slides.option,b),this.each(function(){function w(g,h,i){if(!p&&o){p=!0,b.animationStart(n+1);switch(g){case"next":l=n,k=n+1,k=e===k?0:k,r=f*2,g=-f*2,n=k;break;case"prev":l=n,k=n-1,k=k===-1?e-1:k,r=0,g=0,n=k;break;case"pagination":k=parseInt(i,10),l=a("."+b.paginationClass+" li."+b.currentClass+" a",c).attr("href").match("[^#/]+$"),k>l?(r=f*2,g=-f*2):(r=0,g=0),n=k}h==="fade"?b.crossfade?d.children(":eq("+k+")",c).css({zIndex:10}).fadeIn(b.fadeSpeed,b.fadeEasing,function(){b.autoHeight?d.animate({height:d.children(":eq("+k+")",c).outerHeight()},b.autoHeightSpeed,function(){d.children(":eq("+l+")",c).css({display:"none",zIndex:0}),d.children(":eq("+k+")",c).css({zIndex:0}),b.animationComplete(k+1),p=!1}):(d.children(":eq("+l+")",c).css({display:"none",zIndex:0}),d.children(":eq("+k+")",c).css({zIndex:0}),b.animationComplete(k+1),p=!1)}):d.children(":eq("+l+")",c).fadeOut(b.fadeSpeed,b.fadeEasing,function(){b.autoHeight?d.animate({height:d.children(":eq("+k+")",c).outerHeight()},b.autoHeightSpeed,function(){d.children(":eq("+k+")",c).fadeIn(b.fadeSpeed,b.fadeEasing)}):d.children(":eq("+k+")",c).fadeIn(b.fadeSpeed,b.fadeEasing,function(){a.browser.msie&&a(this).get(0).style.removeAttribute("filter")}),b.animationComplete(k+1),p=!1}):(d.children(":eq("+k+")").css({left:r,display:"block"}),b.autoHeight?d.animate({left:g,height:d.children(":eq("+k+")").outerHeight()},b.slideSpeed,b.slideEasing,function(){d.css({left:-f}),d.children(":eq("+k+")").css({left:f,zIndex:5}),d.children(":eq("+l+")").css({left:f,display:"none",zIndex:0}),b.animationComplete(k+1),p=!1}):d.animate({left:g},b.slideSpeed,b.slideEasing,function(){d.css({left:-f}),d.children(":eq("+k+")").css({left:f,zIndex:5}),d.children(":eq("+l+")").css({left:f,display:"none",zIndex:0}),b.animationComplete(k+1),p=!1})),b.pagination&&(a("."+b.paginationClass+" li."+b.currentClass,c).removeClass(b.currentClass),a("."+b.paginationClass+" li:eq("+k+")",c).addClass(b.currentClass))}}function x(){clearInterval(c.data("interval"))}function y(){b.pause?(clearTimeout(c.data("pause")),clearInterval(c.data("interval")),u=setTimeout(function(){clearTimeout(c.data("pause")),v=setInterval(function(){w("next",i)},b.play),c.data("interval",v)},b.pause),c.data("pause",u))<img src="http://illiweb.com/fa/i/smiles/icon_mad.gif" alt="Mad" longdesc="8" />()}a("."+b.container,a(this)).children().wrapAll('<div class="slides_control"/>');var c=a(this),d=a(".slides_control",c),e=d.children().size(),f=d.children().outerWidth(),g=d.children().outerHeight(),h=b.start-1,i=b.effect.indexOf(",")<0?b.effect:b.effect.replace(" ","").split(",")[0],j=b.effect.indexOf(",")<0?i:b.effect.replace(" ","").split(",")[1],k=0,l=0,m=0,n=0,o,p,q,r,s,t,u,v;if(e<2)return a("."+b.container,a(this)).fadeIn(b.fadeSpeed,b.fadeEasing,function(){o=!0,b.slidesLoaded()}),a("."+b.next+", ."+b.prev).fadeOut(0),!1;if(e<2)return;h<0&&(h=0),h>e&&(h=e-1),b.start&&(n=h),b.randomize&&d.randomize(),a("."+b.container,c).css({overflow:"hidden",position:"relative"}),d.children().css({position:"absolute",top:0,left:d.children().outerWidth(),zIndex:0,display:"none"}),d.css({position:"relative",width:f*3,height:g,left:-f}),a("."+b.container,c).css({display:"block"}),b.autoHeight&&(d.children().css({height:"auto"}),d.animate({height:d.children(":eq("+h+")").outerHeight()},b.autoHeightSpeed));if(b.preload&&d.find("img:eq("+h+")").length){a("."+b.container,c).css({background:"url("+b.preloadImage+") no-repeat 50% 50%"});var z=d.find("img:eq("+h+")").attr("src")+"?"+(new Date).getTime();a("img",c).parent().attr("class")!="slides_control"?t=d.children(":eq(0)")[0].tagName.toLowerCase():t=d.find("img:eq("+h+")"),d.find("img:eq("+h+")").attr("src",z).load(function(){d.find(t+":eq("+h+")").fadeIn(b.fadeSpeed,b.fadeEasing,function(){a(this).css({zIndex:5}),a("."+b.container,c).css({background:""}),o=!0,b.slidesLoaded()})})}else d.children(":eq("+h+")").fadeIn(b.fadeSpeed,b.fadeEasing,function(){o=!0,b.slidesLoaded()});b.bigTarget&&(d.children().css({cursor:"pointer"}),d.children().click(function(){return w("next",i),!1})),b.hoverPause&&b.play&&(d.bind("mouseover",function(){x()}),d.bind("mouseleave",function(){y()})),b.generateNextPrev&&(a("."+b.container,c).after('<a href="#" class="'+b.prev+'">Prev</a>'),a("."+b.prev,c).after('<a href="#" class="'+b.next+'">Next</a>')),a("."+b.next,c).click(function(a){a.preventDefault(),b.play&&y(),w("next",i)}),a("."+b.prev,c).click(function(a){a.preventDefault(),b.play&&y(),w("prev",i)}),b.generatePagination?(b.prependPagination?c.prepend("<ul class="+b.paginationClass+"></ul>"):c.append("<ul class="+b.paginationClass+"></ul>"),d.children().each(function(){a("."+b.paginationClass,c).append('<li><a href="#'+m+'">'+(m+1)+"</a></li>"),m++})):a("."+b.paginationClass+" li a",c).each(function(){a(this).attr("href","#"+m),m++}),a("."+b.paginationClass+" li:eq("+h+")",c).addClass(b.currentClass),a("."+b.paginationClass+" li a",c).click(function(){return b.play&&y(),q=a(this).attr("href").match("[^#/]+$"),n!=q&&w("pagination",j,q),!1}),a("a.link",c).click(function(){return b.play&&y(),q=a(this).attr("href").match("[^#/]+$")-1,n!=q&&w("pagination",j,q),!1}),b.play&&(v=setInterval(function(){w("next",i)},b.play),c.data("interval",v))})},a.fn.slides.option={preload:!1,preloadImage:"/img/loading.gif",container:"slides_container",generateNextPrev:!1,next:"next",prev:"prev",pagination:!0,generatePagination:!0,prependPagination:!1,paginationClass:"pagination",currentClass:"current",fadeSpeed:350,fadeEasing:"",slideSpeed:350,slideEasing:"",start:1,effect:"slide",crossfade:!1,randomize:!1,play:0,pause:0,hoverPause:!1,autoHeight:!1,autoHeightSpeed:350,bigTarget:!1,animationStart:function(){},animationComplete:function(){},slidesLoaded:function(){}},a.fn.randomize=function(b){function c(){return Math.round(Math.random())-.5}return a(this).each(function(){var d=a(this),e=d.children(),f=e.length;if(f>1){e.hide();var g=[];for(i=0;i<f;i++)g[g.length]=i;g=g.sort(c),a.each(g,function(a,c){var f=e.eq(c),g=f.clone(!0);g.show().appendTo(d),b!==undefined&&b(f,g),f.remove()})}})}})(jQuery)
 
 </script>
   <script>
      $(function(){
         $('#slides').slides({
            preload: true,
            preloadImage: 'http://i43.servimg.com/u/f43/17/63/75/60/loadin10.gif',
            play: 5000,
            pause: 2500,
            hoverPause: true
         });
      });
   </script>
</head>
<body>
   <div id="container">
      <div id="example">
         <div id="slides">
            <div class="slides_container">
               <a href="http://img3.fotos-hochladen.net/uploads/slideshow1ixs104z6bp.png" title="Zebras" target="_blank"><img src="http://img3.fotos-hochladen.net/uploads/slideshow1ixs104z6bp.png" width="570" height="270"></a>
          <a href="http://img3.fotos-hochladen.net/uploads/slideshow2c4zar15y6n.png" title="Straße" target="_blank"><img src="http://img3.fotos-hochladen.net/uploads/slideshow2c4zar15y6n.png" width="570" height="270"></a>
            </div>
            <a href="#" class="prev"><img src="http://i43.servimg.com/u/f43/17/63/75/60/arrow-10.png" width="24" height="43" alt="Arrow Prev"></a>
            <a href="#" class="next"><img src="http://i43.servimg.com/u/f43/17/63/75/60/arrow-11.png" width="24" height="43" alt="Arrow Next"></a>
         </div>
         <img src="http://i43.servimg.com/u/f43/17/63/75/60/exampl10.png" width="739" height="341" alt="Example Frame" id="frame">
      </div>
   </div>
</body>
</html>

Allerdings kommt nur dieses Ergebnis hier zustande:

Screenshot:

Ich habe auch schon versucht den Kram in einem eigenen Modul in einem Portal einzufügen, hatte aber genau das selbe Ergebnis. Auch den Code habe ich schon mehrmals abgespeichert, abgeschickt und nochmal kontrolliert. Ich weiß nicht woran die falsche Umsetzung liegt.
Falls sich kurz jemand Zeit nehmen würde wäre ich wirklich sehr dankbar. Ansonsten bin ich auch geduldig =)

Vielen Dank schonmal,
lg


Edit 05.08.13: So, ich habe jetzt schon mehrere Slideshowvarianten aus mehreren Quellen, unter anderem selfhtml ausprobiert. Auch mit einem ganz simplen Überblendungseffekt kommt die Show nicht zustande. Ich bin langsam mit meiner Philosophie am Ende. Wahrscheinlich ist es nur eine ganz simple Einstellung, die nicht mit dem Code übereinstimmt.
Ich würde mich wirklich sehr über Hilfe freuen. Liebe Grüße
avatar
Rush_Hour
Neuling
Neuling

Weiblich Beiträge : 21
Anmeldedatum : 06.04.11
keine
phpBB2

Benutzerprofil anzeigen

Nach oben Nach unten

Erledigt Re: [phpBB2] Slideshow nicht richtig angezeigt

Beitrag von Günther am Fr 9 Aug 2013 - 3:15

Hallo,

das Problem kommt daher, dass du den Code offensichtlich im Beitragseditor bearbeitet hast, mit dem man in Forumieren-Foren Beiträge postet.
HTML-Codes darfst du aber nicht in einem Beitragseditor bearbeiten, sondern ausschließlich in richtigen Codeeditoren/HTML-Editoren.
Empfehlen kann ich dir dazu entweder den Standard-"Editor" von Windows oder die Freeware PSPad:
http://www.chip.de/downloads/PSPad_22393723.html

Du hast den HTML-Code allerdings im Beitragseditor bearbeitet und dann abgesendet bzw. in die Vorschau gebracht. Anschließend hast du den Code kopiert und in die HTML-Seite eingesetzt. Dadurch ist Folgendes passiert: Der Editor hat zwei Codestellen, die zufälligerweise Smileycodes in Forumieren-Foren darstellen, durch den entsprechenden HTML-Code für die Smileys ersetzt. Deshalb befinden sich im Code, den du kopiert hast, zwei fehlerhafte Stellen.

Einmal wurde
Code:
8)
ersetzt:
body {
       background-color: transparent;
  font:normal 62.5%/1.5 Helvetica, Arial, sans-serif;
  letter-spacing:0;
  color:#434343;
  top center;
  position:relative;
  text-shadow:0 1px 0 rgba(255,255,255,.8);
  -webkit-font-smoothing: subpixel-antialiased;
}
zu:
body {
       background-color: transparent;
  font:normal 62.5%/1.5 Helvetica, Arial, sans-serif;
  letter-spacing:0;
  color:#434343;
  top center;
  position:relative;
  text-shadow:0 1px 0 rgba(255,255,255,.<img src="http://illiweb.com/fa/i/smiles/icon_cool.gif" alt="Cool" longdesc="6" />;
  -webkit-font-smoothing: subpixel-antialiased;
}
Und einmal wurde
Code:
:x
ersetzt:
{b.pause?(clearTimeout(c.data("pause")),clearInterval(c.data("interval")),u=setTimeout(function(){clearTimeout(c.data("pause")),v=setInterval(function(){w("next",i)},b.play),c.data("interval",v)},b.pause),c.data("pause",u)):x()}
zu:
{b.pause?(clearTimeout(c.data("pause")),clearInterval(c.data("interval")),u=setTimeout(function(){clearTimeout(c.data("pause")),v=setInterval(function(){w("next",i)},b.play),c.data("interval",v)},b.pause),c.data("pause",u))<img src="http://illiweb.com/fa/i/smiles/icon_mad.gif" alt="Mad" longdesc="8" />()}
Wenn du diese beiden Stellen in deinem Code suchst und mit dem Originalcode aus dem Tuto vergleichst, siehst du das selbst.

Die Lösung ist also: Bearbeite den Code aus dem Tutorial in einem richtigen Editor (und nicht im Beitragseditor) und er wird seine Wirkung zeigen.

Liebe Grüße
Günther
avatar
Günther
Admin a.D.
Admin a.D.

Männlich Beiträge : 15349
Anmeldedatum : 16.07.08
keine
Firefox phpBB3

Benutzerprofil anzeigen

Nach oben Nach unten

Erledigt Re: [phpBB2] Slideshow nicht richtig angezeigt

Beitrag von Rush_Hour am Fr 9 Aug 2013 - 12:17

Tausend Dank! Das macht alles Sinn. Ich hätte dran denken sollen. Dabei arbeite ich schon mit Webpcton Scriptly. Ich werde so schnell wie möglich den Code neu bearbeiten und ausprobieren. Sollte ich noch Probleme haben melde ich mich.

Nochmal vielen Dank!
Liebe Grüße
avatar
Rush_Hour
Neuling
Neuling

Weiblich Beiträge : 21
Anmeldedatum : 06.04.11
keine
phpBB2

Benutzerprofil anzeigen

Nach oben Nach unten

Erledigt Re: [phpBB2] Slideshow nicht richtig angezeigt

Beitrag von Günther am Fr 9 Aug 2013 - 18:53

Bitte. Smile

Da du dich nicht mehr gemeldet hast, gehe ich davon aus, dass es keine Probleme mehr gibt und ich hier schließen kann. Sollten wider Erwarten dennoch Probleme auftreten, gehe bitte so vor, wie es in der roten Hinweisbox unter dem Thread erklärt wird (letzter Absatz).
-closed-
avatar
Günther
Admin a.D.
Admin a.D.

Männlich Beiträge : 15349
Anmeldedatum : 16.07.08
keine
Firefox phpBB3

Benutzerprofil anzeigen

Nach oben Nach unten

Vorheriges Thema anzeigen Nächstes Thema anzeigen Nach oben


 
Befugnisse in diesem Forum
Sie können in diesem Forum nicht antworten