Aus Das deutschsprachige Scratch-Wiki
<html> <body bgcolor="#82caff">
</body> <a href="http://scratch-dach.info/wiki/Benutzer:EasyScratcher"><button>Benutzerseite</button></a><a href="http://scratch-dach.info/wiki/Benutzer_Diskussion:EasyScratcher"><button>Diskussion</button></a><a href="http://scratch-dach.info/wiki/Benutzer_Diskussion:EasyScratcher/Sandkasten"><button>Sandkasten</button></a><a href="http://scratch-dach.info/wiki/Benutzer:EasyScratcher/Code"><button disabled>Code</button></a> </html>
Hier findest du ein paar Beispielcodes (benutzen mit Credits):
Hintergrundsfarbe ändern
Ersetze das #ffff einfach durch deine Farbe:
<html><body bgcolor="#ffff"></body></html>
Bild am Rand der Seite
Ersetze LINK ZUM BILD einfach durch den direkten Link zum Bild:
<html>
<div style="position: fixed; top: 50px; right: 20px;">
<img src="LINK ZUM BILD" alt="" />
</div></html>
Buttons zum ändern der Hintergrundsfarbe
Das ist etwas komplizierter. Kopiert einfach folgenden Code:
<html>
<head>
<script>
function white() {
var x = document.getElementById("body");
x.style.background = "#fff";
}
function yellow() {
var x = document.getElementById("body");
x.style.background = "#FFCC00";
}
function blue() {
var x = document.getElementById("body");
x.style.background = "#82caff";
}
function green() {
var x = document.getElementById("body");
x.style.background = "#8FE63E";
}
</script>
<style>
body {
-webkit-transition: background 1s;
transition: background 1s;
}
.border {
display: table;
width: 40px;
height: 40px;
border-radius: 20px;
background: white;
float: left;
margin: 2.5px;
}
.button {
margin: 3px;
width: 35px;
height: 35px;
border-radius: 20px;
}
#one {
background: #82caff;
}
#two {
background: #dedede;
}
#three {
background: #FFCC00;
}
#four {
background: #8FE63E;
}
</style>
<link href='http://fonts.googleapis.com/css?family=Roboto+Slab:300' rel='stylesheet' type='text/css'>
</head>
<body id="body">
<div class="border">
<div class="button" id="one" onclick="blue()"></div>
</div>
<div class="border">
<div class="button" id="two" onclick="white()"></div>
</div>
<div class="border">
<div class="button" id="three" onclick="yellow()"></div>
</div>
<div class="border">
<div class="button" id="four" onclick="green()"></div>
</div>
</body>
<br><br>
</html>
Das ergibt dann: <html>
<head>
<script>
function white() {
var x = document.getElementById("body");
x.style.background = "#fff";
}
function yellow() {
var x = document.getElementById("body");
x.style.background = "#FFCC00";
}
function blue() {
var x = document.getElementById("body");
x.style.background = "#82caff";
}
function green() {
var x = document.getElementById("body");
x.style.background = "#8FE63E";
}
</script>
<style>
body {
-webkit-transition: background 1s;
transition: background 1s;
} .border {
display: table; width: 40px; height: 40px; border-radius: 20px; background: white; float: left; margin: 2.5px;
} .button {
margin: 3px; width: 35px; height: 35px; border-radius: 20px;
}
- one {
background: #82caff;
}
- two {
background: #dedede;
}
- three {
background: #FFCC00;
}
- four {
background: #8FE63E;
}
</style> <link href='http://fonts.googleapis.com/css?family=Roboto+Slab:300' rel='stylesheet' type='text/css'> </head> <body id="body">
</body>
</html>
