Fotos oder Hintergrundfarben über die gesamte Seite plazieren: Dieses Script erlaubt es mehrere Hintergrundfotos über die gesamte Seite zu plazieren.
Mit diesem Script ist es möglich mehrere Hintergrundfarben oder Fotos über die komplette Breite laufen zu lassen.
<script type="text/javascript">
//<![CDATA[
$(function() {
$('a[href*=#]:not([href=#])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});
});
//]]>
</script>
Dieses Script in der Headerkopf kopieren
<script type="text/javascript">
//<![CDATA[
$(document).ready(function() {
/* This is the Columns Element that we are converting - identify it here */
/* Hier werden die unten definierten Fotos den Bereichen zugeordnet */
$( "" ).wrap( "<div id='section_shadow' />" );
$( "#hier das DIV Element" ).wrap( "<div id='section_foto1' />" );
$( "#hier das DIV Element" ).wrap( "<div id='section_foto2' />" );
$( "" ).wrap( "<div id='section_gray' />" );
});
//]]>
</script>
Dieses Script in den Headerkopf kopieren. Das DIV vom Foto oder Element muss ins das Script kopiert werden
/* This is a fullwidth section - add your comment to describe it */
/* Background Fotos */
#section_foto1 {
background: url("Hier die URL reinkopieren") no-repeat center center fixed;
}
#section_foto2 {
background: url("Hier die URL reinkopieren") no-repeat center center fixed;
}
#section_foto1, #section_foto2 {
margin: 0 -9999rem;
padding: 4rem 9999rem;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
/* This is a fullwidth section - add your comment to describe it */
#section_blue {
margin: 0 -9999rem;
padding: 0 9999rem;
background: #00517c;
}
#section_gray {
margin: 0 -9999rem;
padding: 0 9999rem;
background: #cfd6d8;
}
#section_shadow {
margin: 0 -9999rem;
padding: 0 9999rem;
background: #00517c;
-webkit-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.2);
box-shadow: 0 3px 5px 0 rgba(0,0,0,0.2);
}
Dieser Code wird in den Style Bereich kopiert