Hallo,
was braucht ihr denn genau.
am beten den Code den du geschrieben hast, auch wenn er Fehler enthält, so sehen wir in welche Richtung es gehen soll.
Du kannst deine Beispiel unter codepen.io oder bplaced.net online stellen.
<!DOCTYPE HTML>
<html lang="en"><head>
<title></title>
<meta charset="utf-8">
<link href="css/style.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/style.css" />
<link rel="icon" href=file:///Video 3/HOMEPAGE_2014/site/type="image/favicon">
<link rel="shortcut icon" href="images/favicon.ico" type="image/favicon" />
<link rel="stylesheet" type="text/css" href="gallery_files/grid-gallery.css" />
<script type="text/javascript" src="js/include_scripts.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="gallery_files/jquery.grid-gallery.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery("#JQGridGallery1").fdGridGallery({sourceURL:"gallery_files/gallery.xml",gridAlign:"right",gridSpacing:0,gridAutoResize:true,gridColumnsMin:false,gridColumnsMax:false,gridResizeDelay:50,gridAnimate:true,gridAnimateEasing:"easeOutQuad",gridAnimateDuration:300,gridAnimateDelay:50,categoriesAccordingGrid:false,categoriesScrollingLoop:false,categoriesScrollingStep:1,categoriesScrollingDuration:500,categoriesScrollingEasing:"easeOutQuad",thumbnailsPreload:true,thumbnailsLoadRandom:false,thumbnailsServerScript:"",thumbWidth:100,thumbHeight:0,popupSlideWidth:"80%",popupSlideHeight:"80%",popupLanguageInfo:"_AMOUNT_ of _TOTAL_"});
});
</script>
<script src="js/include_scripts.js"></script>
</head>
<body>
<div id="spinner"></div>
<div id="wrapper">
<!--header-->
<header>
<!--logo-->
<div id="logo">
<a href="#!/splash"><img src="Siegfilm/Bilder/Siegfilm.png"></a>
<span></span>
<div id="logoFalse"></div>
</div>
</header>
<div id = "main">
<!--Splash Menu-->
<nav id="splashMenu">
<ul>
<li><a href="#!/splash">splash</a></li>
<li><a href="#!/mainPage">Home</a></li>
<li><a href="#!/studio">Folio</a></li>
<li><a href="#!/folio">Gallerie</a></li>
<li><a href="#!/vision">Wir</a></li>
<li><a href="#!/contact-us">Kontakt</a></li>
</ul>
</nav>
<!--content-->
<section>
<ul>
<li id="splash"></li>
<!--Home page-->
<li id="mainPage">
<div class="box_1">
<h2>Sei Gegrüßt!</h2>
<div class="inside">
<div class="scroll ex-1 page1">
<div>
<figure>
<img src="Siegfilm/Bilder/page-1-img-1.jpg" alt=""/>
<figcaption class="figMarg">
<p class="col_1">Willkommen in der SIEGFILM Welt - <br> bei Ihrem Partner für Medien.</p>
Imagefilme - Produktvideos - 3D Animationen - Industriefotografie - Audioproduktionen - Grafik und Design.<br><br>
<p class="col_1">Ihren Visionen Raum geben -</p> <br>Ihr Unternehmen, Ihr Produkt verstehen und darstellen,<br>als wäre es unser eigenes. <br><br>
Ihre Inhalte, Ihre Botschaften transportieren, mit Medien, <br>die ihr Ziel erreichen. <br><br>
Kreativ - innovativ - modern und handwerklich perfekt. <br><br>
Konzept - Realisation - Finishing - Publikation -<br> alles aus einer Hand.
</figcaption>
</figure>
</div>
</div>
</div>
</li>
<!--studio page-->
<li id="studio">
<div class="box_1">
<h2>Unsere Tätigkeiten</h2>
<div class="stud_marg"><div class="col_1">um dolor sit amet consectetuer adipaesent lrom port rsen mate hadslelu misle port rsen halelum isleitre sren amet lroem.</div>
lacus Aenean nonummy hendrerit mauris. Phasellus po. Fusce suipit diculus mus. Nulla dui. Fusce feugiat maleda odio. Morbi nunc gravidacursus lroem serrn
necuctus a lorem. Maecenas trist que orci ac uis u.</div>
<div><div class="col_1">ipaesent lrom port rsen mate hadslelu misle.</div>
lacus Aenean nonummy hendrerit mauris. Phasellus po. Fusce suipit diculus mus. Nulla dui. Fusce feugiat maleda odio. Morbi nunc gravidacursus lroem serrn.
<div class="stud_marg_2"><a class="read-more" href="#!/read-more">Read More</a></div>
</div>
</div>
</li>
<!--gallerie page-->
<li id="folio">
<div class="box_1">
<h2>Unsere Gallerie</h2>
<div id="JQGridGallery1" class="JQGridGallery"></div>
</div>
</li>
<!--vision page-->
<li id="vision">
<div class="box_1">
<h2>Siegfilmer</h2>
<figure class="box_3">
<figcaption class="figMarg_page4">
<div class="col_1">Lorem ipsum dolor sit amet consectetuer adipaesent</div >
lacus Aenean nonummy hendrerit mauris. Phasellus po. Fusce suipit diculus mus. Nulla dui. Fusce feugiat maleda odio. Morbi nunc gravidacursus necuctus a lorem. Maecenas trist. lacus Aenean nonummy hendrerit mauris. Phasellus po. Fusce suipit diculus mus. Nulla dui. Fusce feugiat maleda.
</figcaption>
</figure>
</div>
</li>
<!--contact us page-->
<li id="contact-us">
<div class="to_right">
<h2>Kontakt</h2>
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2515.249580141986!2d8.10385!3d50.91910000000001!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47bc04de1cd4dead%3A0x9a7b05a656bc38e4!2sSIEGF ILM+OHG!5e0!3m2!1sde!2sde!4v1444220203182" width="600" height="450" allowfullscreen></iframe>
</div>
<div class="contText">
<p class="cont_col cont_marg"> Siegfilm OhG<br>
Kronprinzenstraße 101 <br>
57250 Netphen<br>
</p>
<p class="to_right">
<span class="col">Telefon:</span>+49 (0)27388233<br>
<span class="col">Fax:</span>+49 (0)27382963<br>
E-mail: <a href="mailto:" class="cont_a">info@siegfilm.de</a><br>
</p>
</div>
</li>
<!--read more page-->
<li id="home">
<div class="box_1">
<h2 class="privMarg">Siegfilmer</h2>
<p >Spannend, abwechslungsreich und modern. <br>
Zusammen mit Ihnen entwickeln wir Konzepte, setzen diese mit unserer Erfahrung und unserem Kown How um. <br>
Wir sprechen die Sprache unserer Kunden. <br>
Wir leben Film, wir fotografieren mit Leidenschaft und wir denken uns hinein in die Vorgänge und Abläufe, die wir festhalten - filmisch erklären, bildlich dokumentieren oder in Animationen sichtbar und verständlich machen. <br>
Der Kontakt und die Nähe zu unseren Kunden sind dabei unabdingbar für den Erfolg. <br>
Viele unserer langjährigen Kunden nennen uns einfach die „Siegfilmer“. <br>
Darauf sind wir stolz. <br>
Dieser Begriff drückt liebevoll unsere Nähe zum Kunden aus. <br>
Die Nähe zu Ihnen. <br>
Wir sind es gewohnt Aufgaben umzusetzen, alle möglichen Hürden zu überwinden - sei es Genehmigungen, unwegsames Gelände, Hitze oder Kälte - es ist eine Leidenschaft die uns Tag für Tag antreibt. <br>
Antreibt für neue und spannende Aufgaben. <br>
Bei der Realisierung helfen uns die weltweiten Kontakte, ein eigener Stützpunkt und ein starker Partner in den USA. <br>
Die Mischung aus Erfahrung, Kreativität und Herausforderung macht uns Spaß und spornt uns an.
</p>
</div>
</li>
<li id="video">
<div class="scroll ex-3 page2">
<h2 class="privMarg">Video</h2>
<p >Video - unsere Leidenschaft <br>
Eine Prämisse von Siegfilm - hochwertiges Equipment, handwerkliches Können, gepaart mit Jahrzehnte langer Erfahrung und dem dazugehörigen Fachwissen führt zu tollen Ergebnissen. <br>
Wir arbeiten nicht nur ab - wir stecken in jedes unsere Projekte auch ein gehöriges Maß an Leidenschaft und „Herzblut“. <br>
Wir sind Partner unserer Kunden. <br>
Sie stellen uns die Aufgabe und wir, das Siegfilm-Team löst sie. <br>
Von der Idee über das Storyboard, den entsprechenden Genehmigungen bis hin zum fertigen Video - das machen wir!<br>
Wir sind immer für unsere Kunden einsatzbereit. <br>
Einsatzbereit mit eigenem Equipment auf dem neusten Stand der Technik. <br>
Vier komplette „Kamerazüge“ der neusten Generation - 4K - HDTV und HDTV 3D - stehen für den weltweiten Einsatz bereit. <br>
Erfahrene „Siegfilmer“ beherrschen das Equipment und bringen auch die entsprechende Erfahrung und das nötige „Fingerspitzengefühl“ mit zum Dreh. <br>
Neben den Kameras verfügen wir natürlich auch über einen Videokran mit einem ferngesteuerten Videokopf (Remotehead) für spannende Aufnahmen. <br>
</p>
</div>
</li>
<li id="ani">
<h2 class="privMarg">Animation</h2>
<p >3D - Animationen und Grafik <br><br>
Komplexe und anspruchsvolle Abläufe verständlich und sinnvoll darstellen erfordert <br> ein Höchstmaß an technischem Verständnis. <br><br>
Bei der Umsetzung ist eine unabdingbare Aufgabe, den richtigen Mix zwischen Technik <br> und Kreativität zu finden. <br>
Dieser Mix entscheidet, neben Erfahrung und Können, über den Erfolg einer Animation. <br>
Bei der Konzeption einer Animation arbeiten wir eng mit unseren Kunden zusammen und lassen <br>auch den Aspekt der „Mehrfachnutzung“ nicht außer Acht. <br>
Durch unsere jahrelange Erfahrung und unser Verständnis für komplexe <br>Zusammenhänge und Abläufe, sind wir in der Lage,anspruchsvolle Aufgaben umzusetzen. <br>
Vom Aufbau und der Realisierung sind alle unsere Animationen so konzipiert, <br>dass Stills (Standbilder) in jeder erforderlichen <br>Auflösung und Größe daraus generiert werden können.
</p>
</li>