Forum - 5 verschiedene Hintergrundwechsler für Forum und Homepage - Teil 1

Hintergrundfarbe löschen oder umbenennen:
body {background: #......;}
oder umbenennen in z.B.:
body {background-color: #E9E9E9;}
 
Hintergrundbild löschen:
body {background: url(https://.................... );}
oder
body {background-image: url(https://.................... );}
 

<script>
function zufall(){
var backImage = [
"https://files.homepagemodules.de/b104774/f46t1197p2704n55_crUpGYli.jpg",
"https://files.homepagemodules.de/b104774/f46t1197p2704n56_IJocTREC.jpg",
"https://files.homepagemodules.de/b104774/f46t1197p2704n57_queRaPpN.jpg",
];
 
var zeilenanzahl = backImage.length - 1;
var zeile = Math.round(Math.random()/(1/zeilenanzahl));
document.getElementsByTagName("body")[0].background=backImage[zeile];
}
 
window.onload = zufall();
</script>
 

Hintergrundfarbe löschen oder umbenennen:
body {background: #......;}
oder umbenennen in z.B.:
body {background-color: #E9E9E9;}
 
Hintergrundbild löschen:
body {background: url(https://.................... );}
oder
body {background-image: url(https://.................... );}
 

<script>
var timeChange = 5000;
var bildChange = [
'https://files.homepagemodules.de/b104774/f46t1197p2704n55_crUpGYli.jpg',
'https://files.homepagemodules.de/b104774/f46t1197p2704n56_IJocTREC.jpg',
'https://files.homepagemodules.de/b104774/f46t1197p2704n52_tKbFyagH.jpg',
'https://files.homepagemodules.de/b104774/pictures_u554_tFrmxKbz.jpg'
];
 
var zeileChange = "0";
function bildwechseln() {
document.getElementsByTagName("body")[0].background=bildChange[zeileChange];
zeileChange++;
if (zeileChange == bildChange.length) {
zeileChange = 0;
}
 
setTimeout("bildwechseln()",timeChange);
}
 
window.onload = bildwechseln;
</script>
 

Hintergrundfarbe löschen oder umbenennen:
body {background: #......;}
oder umbenennen in z.B.:
body {background-color: #E9E9E9;}
 
Hintergrundbild löschen:
body {background: url(https://.................... );}
oder
body {background-image: url(https://.................... );}
 

<script language="javascript" type="text/javascript">
function switch_time_background() {
 
// Hintergrundbilder für Uhrzeiten definieren:
var time_bg = new Array(
{ time: 0, url: 'https://addpics.com/files/6v-4k-fdd7.jpg' },
{ time: 8, url: 'https://addpics.com/files/6v-4j-a755.jpg' },
{ time: 12, url: 'https://addpics.com/files/6v-4k-fdd7.jpg' },
{ time: 16, url: 'https://addpics.com/files/6v-4i-7193.jpg' },
{ time: 20, url: 'https://addpics.com/files/6v-4j-a755.jpg' });
 
// Testzeit - überschreibt tatsächliche Uhrzeit
// Für Wert "null" volle Stunde eintragen (z.B.: 12)
// Wert "null" Grundstellung!
var test_time = null;	
 
var body_bg = '';
var time = new Date();
var hour = time.getHours();
if (test_time != null)
hour = test_time;
 
for (var i=(time_bg.length-1); i>=0; i--) {
if (hour >= time_bg[i].time) {
body_bg = time_bg[i].url;
break;
}}	
 
if (body_bg != '')
document.getElementsByTagName('body')[0].style.backgroundImage = 'url('+body_bg+')';
}
 
window.onload = switch_time_background;
</script>
 
 

Hintergrundfarbe löschen oder umbenennen:
body {background: #......;}
oder umbenennen in z.B.:
body {background-color: #E9E9E9;}
 
Hintergrundbild löschen:
body {background: url(https://.................... );}
oder
body {background-image: url(https://.................... );}
 

<style type="text/css">
    
  body {
    background-size:100% 100%;
    -moz-background-size:100% 100%;
    background-attachment:fixed;
    background-color:#223376;
  }
  .bgtopnavi {
    position: absolute !important;
    float: left !impotant;
    z-index: 9000 !important;
    top:0px;
  }
  .bgimagepalette {
    display:inline-block;
    z-index:9000;	
    margin: 5px !important;
    height: 15px !important;
    width: 20px !important;
    border: 1px solid #eeeeee !important;
    cursor:pointer !important;
}
 
  .bgimagesswitch1 { 	
    /* background:url(//files.homepagemodules.de/b104774/f46t1197p2704n55_crUpGYli.jpg); */
    background: #223376;
	}
  .bgimagesswitch2 {
    background:url(//files.homepagemodules.de/b104774/f46t1197p2704n56_IJocTREC.jpg);
	}
  .bgimagesswitch3 	{
    background:url(//files.homepagemodules.de/b104774/f46t1197p2704n57_queRaPpN.jpg);
	}
  .bgimagesswitch4 	{
    background:url(//files.homepagemodules.de/b104774/f46t1197p2704n53_KjxQsSrm.jpg);
	}
  .bgimagesswitch5 	{
    background:url(//files.homepagemodules.de/b104774/f46t1197p2704n52_tKbFyagH.jpg);
	}
  .bgimagesswitch6 	{
    background:url(//files.homepagemodules.de/b104774/pictures_u554_tFrmxKbz.jpg);
	}
 
</style>
 

<!--Nur wenn JQuery nicht vorhanden ist (Standard-Template), die Zeichen fürs "Auskommentieren" in der nächsten Zeile löschen-->
<!--<script type="text/javascript" src="https://img.homepagemodules.de/ds/static/jquery/min/jquery-1.7.1.min.js"></script>-->
 
<script type="text/javascript">
$('div.topnavigation_wrap').prepend($('div.bgtopnavi'));
 
var getColour = localStorage.background;
$("body").addClass(getColour);
 
$(document).ready(function () {
 
//Vorschau
$('.bgimagepalette').hover(function() {
 
$("body").removeClass(getColour);
var getColour = $(this).attr("id"); 
$("body").addClass(getColour);
$('.flagcounter,#google_translate_element,.header,.container,.background_hidden,.footer,.imageslider,.transl').attr('style','visibility:hidden !important;'); 
$('#fb_like,#blog-sidebar').attr('style','display:none !important;');
 
}, function() {
 
$("body").removeClass(getColour);
var getColour = localStorage.background;
$("body").addClass(getColour); 
$('#blog-sidebar,#fb_like,.flagcounter,#google_translate_element,.header,.container,.background_hidden,.footer,.imageslider,.transl').attr('style','visibility:visible !important;'); 
});
 
//Hintergrundbild festlegen                               
$('.bgimagepalette').click(function () {
//$("body").removeClass(getColour);
//localStorage.removeItem('background');
var getColour = $(this).attr("id");
localStorage.setItem("background", getColour);
});
});
 
</script>
 
<!-- Leiste der Auslöse-Button -->
<div class="bgtopnavi" title="Hintergrundbild durch einen Mausklick ändern!">
  
  <div id="bgimagesswitch1" class="bgimagepalette bgimagesswitch1"></div>
  <div id="bgimagesswitch2" class="bgimagepalette bgimagesswitch2"></div>
  <div id="bgimagesswitch3" class="bgimagepalette bgimagesswitch3"></div>
  <div id="bgimagesswitch4" class="bgimagepalette bgimagesswitch4"></div>
  <div id="bgimagesswitch5" class="bgimagepalette bgimagesswitch5"></div>
  <div id="bgimagesswitch6" class="bgimagepalette bgimagesswitch6"></div>
  
</div>