html5风景首页,HTML5+jQuery都市风景

JavaScript

语言：

JaveScriptBabelCoffeeScript

确定

function RandomColor(type) {

/// Creates a random color, returning it to the caller.

/// The type of random color to produce.

/// Possible values are "hex", "rgb", "rgba".

/// If not provided, a hexidecimal color is provided.

type = type ? type.toLowerCase() : "hex";

var result = "";

function Random(max) {

return Math.floor(Math.random() * (max + 1));

}

if (type == "hex") {

for (var i = 0; i < 3; i++) {

var color = ("0" + Random(256).toString(16));

result = result + color.substring(color.length - 2);

}

return "#" + result;

} else {

result = "";

for (var i = 0; i < 3; i++)

result += ", " + Random(256).toString(10);

if (type == "rgba")

result += ", " + (Math.floor(Math.random() * 100) / 100).toString(10);

return "rgb" + (type == "rgba" ? "a" : "") + "(" + result.substring(2) + ")";

}

}

$(function() {

var winWidth = $(document).width() * 5,

container = $("

");

for (var i = 0; i < 100; i++) {

var height = Math.floor((100 + Math.random() * 600 + Math.random() * Math.random() * 100) / 34) * 34,

width = Math.floor((100 + Math.random() * 100) / 26) * 26,

html = "";

for (var j = 0; j < height; j += 34)

for (var k = 0; k < width; k += 26)

html += "

var building = $("

", {

"class": "building",

html: html,

css: {

left: Math.random() * winWidth - 50,

height: height,

width: width,

background: "-webkit-linear-gradient(top left, " + RandomColor("rgb") + ", " +

RandomColor("rgb") + ")"

}

}).appendTo(container);

}

container.appendTo(document.body);

});