Problem mit template und Grid Photogallerie
bearbeitet von Gunnar Bittersmann> 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](http://codepen.io) oder [bplaced.net](http://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>