Wreeze
Ensign
- Registriert
- Dez. 2004
- Beiträge
- 136
Hallo,
ich arbeite an einer one-page-webseite mit parallax effekt.
die seite arbeitet mit slied, das heißt, adss der inhalt von unten nach obnen scrollt (umgesetzt mit stellar.js)
nun habe ich auf einer parallax-seite einen image-slider (camera.js)
dieser funktioniert aber nur einmal. sobald der zweite image-slider kommt, zeigt dieser keine fotos an! es ist nur der rahmen, die buttons vom image-slider sichtbar. aber der bereich der die fotos zeigt ist einfach durchsichtig, keine fotos.
wie kann das sein?
hier der code. auf der ersten parralax-slide fuunktioniert der image-slider. auf der zweiten parallax-slide schon nciht mehr. obwohl er sollte -.-
Die erste parallax-slide auf der der image-slider wunderbar funktioniert.
die zweite parallax slide auf dem der image-slide genauso aufgebaut ist, aber keine fotos zeigt. der pfad stimmt auch.wie kann das sein?
ich arbeite an einer one-page-webseite mit parallax effekt.
die seite arbeitet mit slied, das heißt, adss der inhalt von unten nach obnen scrollt (umgesetzt mit stellar.js)
nun habe ich auf einer parallax-seite einen image-slider (camera.js)
dieser funktioniert aber nur einmal. sobald der zweite image-slider kommt, zeigt dieser keine fotos an! es ist nur der rahmen, die buttons vom image-slider sichtbar. aber der bereich der die fotos zeigt ist einfach durchsichtig, keine fotos.
wie kann das sein?
hier der code. auf der ersten parralax-slide fuunktioniert der image-slider. auf der zweiten parallax-slide schon nciht mehr. obwohl er sollte -.-
HTML:
<script>
jQuery(function(){
jQuery('#camera_wrap_1').camera({
thumbnails: true,
fx: 'simpleFade',
loader: 'none',
thumbnails: 'false',
easing: 'easeInOutExpo'
});
jQuery('#camera_wrap_2').camera({
thumbnails: true,
fx: 'simpleFade',
loader: 'none',
thumbnails: 'false',
easing: 'easeInOutExpo'
});
});
</script>
Die erste parallax-slide auf der der image-slider wunderbar funktioniert.
HTML:
<!-- ####################################################################################################################################### -->
<!-- ######################################################### S L I D E 2 ############################################################## -->
<!-- ####################################################################################################################################### -->
<div class="slide" id="slide2" data-slide="2" data-stellar-background-ratio="0.5">
<div class="naviwrapper">
<ul class="navigation">
<li data-slide="1"># 1</li>
<li data-slide="2"># 2</li>
<li data-slide="3"># 3</li>
<li data-slide="4"># 4</li>
</ul>
</div>
<div class="textfeldBG" data-stellar-ratio="1.6" data-stellar-horizontal-offset="0" data-stellar-vertical-offset="0"alt="">
<!-- hintergrund vom text. grauer kasten -->
</div>
<div class="textfeld" data-stellar-ratio="2" data-stellar-vertical-offset="0"alt="">
Antimaterie ist die Sammelbezeichnung für Antiteilchen und alles, was aus ihnen aufgebaut ist, so wie die „normale“ Materie aus „normalen“ Teilchen besteht. Antimaterie kann die Form von Atomen und Molekülen haben, die gebundene Systeme aus Positronen, Antiprotonen und ggf. Antineutronen sind.
In der beobachtbaren Welt ist Antimaterie sehr kurzlebig, weil beim Aufeinandertreffen eines Teilchen-Antiteilchen-Paares sich beide gegenseitig unter Energiefreisetzung in einer Annihilations-Reaktion vernichten.<br><br>
Einige leichte Antiteilchen sind in der Natur allgegenwärtig, aber Atome oder Moleküle aus Antimaterie kommen, soweit bekannt, nicht natürlich vor.
Antiteilchen und auch Antimaterie-Atome lassen sich in Paarbildungsreaktionen mittels Teilchenbeschleunigern erzeugen. Mit wesentlich kleinerem Aufwand können Positronen durch Herstellung beta-plus-aktiver Radionuklide gewonnen werden. Diese Positronenstrahlung hat wichtige Anwendungen in der Medizin.
Das erste Antimaterieteilchen, das Positron, wurde im Jahr 1932 von Carl David Anderson in der kosmischen Strahlung nachgewiesen.[4] Auch Antimyonen werden von der kosmischen Strahlung erzeugt, wenn sie in die Erdatmosphäre eindringt.
</div>
<div class="fluid_container" >
<div class="camera_wrap camera_azure_skin" id="camera_wrap_1">
<div data-src="images/slides/bridge.jpg">
<div class="camera_caption fadeFromBottom">
Camera is a responsive/adaptive slideshow. <em>Try to resize the browser window</em>
</div>
</div>
<div data-src="images/slides/leaf.jpg">
<div class="camera_caption fadeFromBottom">
It uses a light version of jQuery mobile, <em>navigate the slides by swiping with your fingers</em>
</div>
</div>
<div data-src="images/slides/road.jpg">
<div class="camera_caption fadeFromBottom">
<em>It's completely free</em> (even if a donation is appreciated)
</div>
</div>
<div data-src="images/slides/sea.jpg">
<div class="camera_caption fadeFromBottom">
Camera slideshow provides many options <em>to customize your project</em> as more as possible
</div>
</div>
<div data-src="images/slides/shelter.jpg">
<div class="camera_caption fadeFromBottom">
It supports captions, HTML elements and videos and <em>it's validated in HTML5</em> (<a href="http://www.google.de" target="_blank">have a look</a>)
</div>
</div>
<div data-src="images/slides/tree.jpg">
<div class="camera_caption fadeFromBottom">
Different color skins and layouts available, <em>fullscreen ready too</em>
</div>
</div>
</div>
</div>
<img sry="images/bgstar.png" width="300px">
<span class="title" data-stellar-ratio="2" data-stellar-vertical-offset="0"alt="">Antimaterie</span>
<span class="balken" data-stellar-ratio="1.5" data-stellar-vertical-offset="0"alt=""></span>
</div></div><!--End Slide 2-->
die zweite parallax slide auf dem der image-slide genauso aufgebaut ist, aber keine fotos zeigt. der pfad stimmt auch.wie kann das sein?
HTML:
<div class="slide" id="slide3" data-slide="3" data-stellar-background-ratio="0.5">
<div class="naviwrapper" >
<ul class="navigation">
<li data-slide="1"># 1</li>
<li data-slide="2"># 2</li>
<li data-slide="3"># 3</li>
<li data-slide="4"># 4</li>
</ul>
</div>
<div class="textfeldBG" data-stellar-ratio="1.6" data-stellar-horizontal-offset="0" data-stellar-vertical-offset="0"alt="">
<!-- hintergrund vom text. grauer kasten -->
</div>
<div class="textfeld" data-stellar-ratio="2" data-stellar-vertical-offset="0"alt="">
Ein Schwarzes Loch ist ein astronomisches Objekt, dessen Gravitation so extrem stark ist, dass aus diesem Raumbereich nichts - auch kein Lichtsignal - nach außen gelangen kann. Nach der Allgemeinen Relativitätstheorie verformt eine ausreichend kompakte Masse die Raumzeit so stark, dass sich ein Schwarzes Loch bildet.
<br><br>
Der Begriff „Schwarzes Loch“ wurde 1967 durch John Archibald Wheeler etabliert (nicht aber erfunden, wie oft behauptet). Er verweist auf den Umstand, dass sich im Außenraum von hinreichend kompakten Massen oder Energieanhäufungen ein durch den Ereignishorizont charakterisiertes Raumgebiet bildet, in das Materie nur hineinfallen, aber nicht wieder hinausgelangen kann („Loch“) und das insbesondere auch eine elektromagnetische Welle, wie etwa sichtbares Licht, niemals verlassen kann (daher „schwarz“).
<br><br>
Der Extremfall ist der Außenraum um eine Krümmungssingularität der Raumzeit. Je nach Literatur kann sich der Begriff aber auch auf die Singularität selbst beziehen.[1]
</div>
<div class="fluid_container2">
<div class="camera_wrap camera_azure_skin" id="camera_wrap_2">
<div data-src="images/slides/bridge1.jpg">
<div class="camera_caption fadeFromBottom">
Camera is a responsive/adaptive slideshow. <em>Try to resize the browser window</em>
</div>
</div>
<div data-src="images/slides/leaf1.jpg">
<div class="camera_caption fadeFromBottom">
It uses a light version of jQuery mobile, <em>navigate the slides by swiping with your fingers</em>
</div>
</div>
<div data-src="images/slides/road1.jpg">
<div class="camera_caption fadeFromBottom">
<em>It's completely free</em> (even if a donation is appreciated)
</div>
</div>
<div data-src="images/slides/sea1.jpg">
<div class="camera_caption fadeFromBottom">
Camera slideshow provides many options <em>to customize your project</em> as more as possible
</div>
</div>
<div data-src="images/slides/shelter1.jpg">
<div class="camera_caption fadeFromBottom">
It supports captions, HTML elements and videos and <em>it's validated in HTML5</em> (<a href="http://www.google.de" target="_blank">have a look</a>)
</div>
</div>
<div data-src="images/slides/tree1.jpg">
<div class="camera_caption fadeFromBottom">
Different color skins and layouts available, <em>fullscreen ready too</em>
</div>
</div>
</div>
</div>
<img sry="images/bgstar.png" width="300px">
<span class="title" data-stellar-ratio="2" data-stellar-vertical-offset="0"alt="">Schwarze Loecher</span>
<span class="balken" data-stellar-ratio="1.5" data-stellar-vertical-offset="0"alt=""></span>