Royal Slider (Jquery)

Guten Morgen

Liebe Mittwald User,

Ich Hätte da eine Frage, Ich habe Dieses Jquery script name von dem ist Royal Slider http://codecanyon.net/item/royalslider-touchenabled-jquery-image-gallery/461126 .

Dieses Script fuktioniert da ist alles dabei CSS,js,html, und jquery datein, allso ales was man braucht ich habe dies auch ohne Typo3 Getestet http://www.campuseurop.eu Das war ohne Typo3.

ICh Würde es aber in Typo3 Rein haben Ich habe auch schon damit angefangen und zu testen und rumgewurschtelt aber Alles was ich gemacht habe brachte nichts nur ein stück. Habe es auch schon hochgeladen wie es ausiht in typo3.

Mit Freundlichen Grüßen euer Delta1989

PS: Bitte Entschuldigen wenn dies im flaschen Forum drin ist wuste nicht wo ich dies rein schreiben sollte. Und Zur info ich bin ein Student und ich habe mich schon in typo3 eingearbeitet aber so tief noch nicht deshlab frage ich euch bitte helft mir.

Contentframe mit HTML

<div id="main-body">		
		<h1>RoyalSlider Demo: Image Gallery</h1>
		<div id="slider-ajax-container">
<div id="image-gallery" class="royalSlider default">   
    <ul class="royalSlidesContainer dragme">  
        <li class="royalSlide" data-thumb="fileadmin/templates/bilder/galleryAssets/Hyla1.jpg" data-src="fileadmin/templates/bilder/galleryAssets/Hyla2.jpg">  
        	<div class="royalCaption"> 
            	<div class="royalCaptionItem royalMidText">Gallery example (smart lazy-loading enabled)</div>               
            </div>                                                   
        </li>                           
        <li class="royalSlide" data-thumb="fileadmin/templates/bilder/galleryAssets/2_thumb.jpg" data-src="fileadmin/templates/bilder/galleryAssets/2.jpg">                           
            <div class="royalCaption"> 
                <div class="royalCaptionItem" style="font-size: 1em;">Bird photography in this demo by <a href="http://www.flickr.com/photos/johnfish/" target="_blank">John&amp;Fish</a><br></div>                                                 
            </div>             
        </li>
        <li class="royalSlide" data-thumb="fileadmin/templates/bilder/galleryAssets/3_thumb.jpg" data-src="fileadmin/templates/bilder/galleryAssets/3.jpg">                       
            <div class="staticTextBlock" style="position: absolute;">I'm a static text block</div>
        </li>
        <li class="royalSlide" data-thumb="fileadmin/templates/bilder/galleryAssets/4_thumb.jpg" data-src="fileadmin/templates/bilder/galleryAssets/4.jpg"></li>
        <li class="royalSlide" data-thumb="fileadmin/templates/bilder/galleryAssets/5_thumb.jpg" data-src="fileadmin/templates/bilder/galleryAssets/5.jpg">
        	<div class="staticTextBlock non-draggable" style="position: absolute;">I'm a static and selectable text block</div>
        	
        </li>
        <li class="royalSlide" data-thumb="fileadmin/templates/bilder/galleryAssets/6_thumb.jpg" data-src="fileadmin/templates/bilder/galleryAssets/6.jpg"></li>      
        <li class="royalSlide" data-thumb="fileadmin/templates/bilder/galleryAssets/7_thumb.jpg" data-src="fileadmin/templates/bilder/galleryAssets/7.jpg"></li>   
        <li class="royalSlide" data-thumb="fileadmin/templates/bilder/galleryAssets/8_thumb.jpg" data-src="fileadmin/templates/bilder/galleryAssets/8.jpg"></li>   
        <li class="royalSlide" data-thumb="fileadmin/templates/bilder/galleryAssets/9_thumb.jpg" data-src="fileadmin/templates/bilder/galleryAssets/9.jpg"></li>   
        <li class="royalSlide" data-thumb="fileadmin/templates/bilder/galleryAssets/10_thumb.jpg" data-src="fileadmin/templates/bilder/galleryAssets/10.jpg"></li>   
        <li class="royalSlide" data-thumb="fileadmin/templates/bilder/galleryAssets/11_thumb.jpg" data-src="fileadmin/templates/bilder/galleryAssets/11.jpg"></li>   
        <li class="royalSlide" data-thumb="fileadmin/templates/bilder/galleryAssets/12_thumb.jpg" data-src="fileadmin/templates/bilder/galleryAssets/12.jpg"></li>   
        <li class="royalSlide" data-thumb="fileadmin/templates/bilder/galleryAssets/13_thumb.jpg" data-src="fileadmin/templates/bilder/galleryAssets/13.jpg"></li>                         
     
        </ul> 
</div>
		</div>		
	</div>
	
    
	<script>            
	jQuery(document).ready(function($) {			   
		$('#image-gallery').royalSlider({
	    	captionShowEffects:["fade"],
			controlNavThumbs:true,			
					
			imageAlignCenter:true,
			
			directionNavEnabled: true,
			welcomeScreenEnabled:false,
			hideArrowOnLastSlide:true
			
			
	    });	   
	});
    </script>

Das habe ich in den contentframe drin stehn und habe auch alle sachen verlinkt und auch die css datein und bilder datein habe ich verlinkt das die man sehn kann.

und in dem template setup habe ich das drin stehn

page = PAGE
page.typeNum = 0

#dies ist das Hintergrundbild und weiße Schrift unter dem Rahmen
#page.includeCSS.screen = fileadmin/templates/css/ext_slideshow.css

#Slideshow css
page.includeCSS.screen = fileadmin/templates/css/royalslider.css
page.includeCSS.screen = fileadmin/templates/css/royalslider-skins/default/default.css
page.includeCSS.screen = fileadmin/templates/css/royalslider-skins/iskin/iskin.css

#Slideshow Prievwe
page.includeCSS.screen = fileadmin/templates/css/royalslider-preview.css

#jquery SETUP
#page.includeJS.jQuery = https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js
#page.includeJS.jQuery.external = 1
#page.includeJS.jQueryUI = https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js
#page.includeJS.jQueryUI.external = 1

#Slideshow JS
page.includeJS.file1 = fileadmin/templates/js/jquery-1.6.2.min.js
page.includeJS.file2 = fileadmin/templates/js/jquery.easing.1.3.min.js
page.includeJS.file3 = fileadmin/templates/js/royal-slider-8.1.min.js