07c290a453
- zoesch.de - blitzkiste.net - gruene-hassberge (norbert.zoesch.de) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
127 lines
7.3 KiB
HTML
127 lines
7.3 KiB
HTML
<!-- Gallerie -->
|
||
<div class="gallery container-fluid">
|
||
<div class="row gallery-content">
|
||
<h3 id="gallery">Galerie</h3>
|
||
<div class="row">
|
||
|
||
<div class="col-sm-6 col-md-4">
|
||
<div class="thumbnail">
|
||
<img src="img/artwork.png" class="first-img" alt="ARTWORKS">
|
||
<h4>Artworks</h4>
|
||
<p>Hier sind einige meiner letzten Arbeiten mit Adobe Illustrator und Photoshop. Um sich die Bilder anzusehen, klicken Sie auf den Button.</p>
|
||
<div id="artworks">
|
||
<a href="gallery/artworks/MacBookPro_Black.jpg" title="Black MacBook Pro" data-gallery="#blueimp-gallery-artworks" class="btn btn-primary btn-lg" role="button">Anzeigen</a>
|
||
<a href="gallery/artworks/desk_macbook.jpg" title="Hero Image MacBook" data-gallery="#blueimp-gallery-artworks"></a>
|
||
<a href="gallery/artworks/hero_desktop.jpg" title="Hero Image Desctop" data-gallery="#blueimp-gallery-artworks"></a>
|
||
<a href="gallery/artworks/gallery_icons.jpg" title="Gallery Icon Set" data-gallery="#blueimp-gallery-artworks"></a>
|
||
<a href="gallery/artworks/itsme_flatdesign.png" title="Vector Profilpicture" data-gallery="#blueimp-gallery-artworks"></a>
|
||
<a href="gallery/artworks/Zoesch_Logo_fd.jpg" title="My own Zoesch Logo" data-gallery="#blueimp-gallery-artworks"></a>
|
||
<a href="gallery/artworks/Zoesch_Logo_colorful.jpg" title="Other versions of my Logo" data-gallery></a>
|
||
<a href="gallery/artworks/cs_icon_set.jpg" title="Adobe CS6 Flat Design Icon Set" data-gallery="#blueimp-gallery-artworks"></a>
|
||
<a href="gallery/artworks/Arrows_Z.png" title="Arrow Tattoo Style" data-gallery="#blueimp-gallery-artworks"></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="col-sm-6 col-md-4">
|
||
<div class="thumbnail">
|
||
<img src="img/camera.png" class="img" alt="PHOTOGRAPHY">
|
||
<h4>Fotographie</h4>
|
||
<p>Ich mag es zu reisen und neue Erfahrunegn zu sammeln. Diese einzigartigen Mommente versuche ich auf meinen Bildern festzuhalten.</p>
|
||
<div id="photos">
|
||
<a href="gallery/photos/Porto_di_Bolsena_HDR2.png" title="Porto di Bolsena HDR" data-gallery="#blueimp-gallery-photos" class="btn btn-primary btn-lg" role="button">Anzeigen</a>
|
||
<a href="gallery/photos/Porto_di_Bolsena_small.png" title="Porto di Bolsena Panorama" data-gallery="#blueimp-gallery-photos"></a>
|
||
<a href="gallery/photos/Kaepperle_pano.png" title="Panorama of my hometown" data-gallery="#blueimp-gallery-photos"></a>
|
||
<a href="gallery/photos/Garten_HDR.png" title="Home HDR" data-gallery="#blueimp-gallery-photos"></a>
|
||
<a href="gallery/photos/IMG_1927.JPG" title="Photo of a whirlwind near us" data-gallery="#blueimp-gallery-photos"></a>
|
||
<a href="gallery/photos/raindrops.jpg" title="Raindrops" data-gallery="#blueimp-gallery-photos"></a>
|
||
<a href="gallery/photos/zoeschart_back.jpg" title="Macro of my camera lens" data-gallery="#blueimp-gallery-photos"></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="col-sm-6 col-md-4">
|
||
<div class="thumbnail">
|
||
<img src="img/client_work.png" class="img" alt="PROJECTS">
|
||
<h4>Projekte</h4>
|
||
<p>Eine kleine Auswahl an Arbeiten für Kunden, habe ich hier zusammengestellt. Wenn Ihnen meine Arbeit gefällt, gerne melden ;)</p>
|
||
<div id="projects">
|
||
<a href="gallery/projects/stw_icons.jpg" title="Icon Set for a puplic utility company" data-gallery="#blueimp-gallery-projects" class="btn btn-primary btn-lg" role="button">Anzeigen</a>
|
||
<a href="gallery/projects/rabbit_home.jpg" title="Logodesign for a smart-home system" data-gallery="#blueimp-gallery-projects"></a>
|
||
<a href="gallery/projects/esc_01.png" title="Design for a service-card" data-gallery="#blueimp-gallery-projects"></a>
|
||
<a href="gallery/projects/header_esc2.jpg" title="Design for header with the service-card" data-gallery="#blueimp-gallery-projects"></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!--blueimp Gallery lightbox -->
|
||
<div id="blueimp-gallery" class="blueimp-gallery blueimp-gallery-controls" data-use-bootstrap-modal="false">
|
||
<div class="slides"></div>
|
||
<h3 class="title"></h3>
|
||
<a class="prev">‹</a>
|
||
<a class="next">›</a>
|
||
<a class="close">×</a>
|
||
<a class="play-pause"></a>
|
||
<ol class="indicator"></ol>
|
||
<!-- The modal dialog, which will be used to wrap the lightbox content -->
|
||
<div class="modal fade">
|
||
<div class="modal-dialog">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<button type="button" class="close" aria-hidden="true">×</button>
|
||
<h4 class="modal-title"></h4>
|
||
</div>
|
||
<div class="modal-body next"></div>
|
||
<div class="modal-footer">
|
||
<button type="button" class="btn btn-default pull-left prev">
|
||
<i class="glyphicon glyphicon-chevron-left"></i>
|
||
Previous
|
||
</button>
|
||
<button type="button" class="btn btn-primary next">
|
||
Next
|
||
<i class="glyphicon glyphicon-chevron-right"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- /blueimp Gallery lightbox -->
|
||
|
||
|
||
<script src="js/jquery.blueimp-gallery.min.js"></script>
|
||
<script src="js/bootstrap-image-gallery.min.js"></script>
|
||
<script>
|
||
document.getElementById('artworks').onclick = function (event) {
|
||
event = event || window.event;
|
||
var target = event.target || event.srcElement,
|
||
link = target.src ? target.parentNode : target,
|
||
options = {index: link, event: event, hidePageScrollbars: false},
|
||
links = this.getElementsByTagName('a');
|
||
blueimp.Gallery(links, options);
|
||
};
|
||
</script>
|
||
<script>
|
||
document.getElementById('photos').onclick = function (event) {
|
||
event = event || window.event;
|
||
var target = event.target || event.srcElement,
|
||
link = target.src ? target.parentNode : target,
|
||
options = {index: link, event: event, hidePageScrollbars: false},
|
||
links = this.getElementsByTagName('a');
|
||
blueimp.Gallery(links, options);
|
||
};
|
||
</script>
|
||
<script>
|
||
document.getElementById('projects').onclick = function (event) {
|
||
event = event || window.event;
|
||
var target = event.target || event.srcElement,
|
||
link = target.src ? target.parentNode : target,
|
||
options = {index: link, event: event, hidePageScrollbars: false},
|
||
links = this.getElementsByTagName('a');
|
||
blueimp.Gallery(links, options);
|
||
};
|
||
</script> |