随机背景图片背景剪辑

在我的个人网站：http://pavelrozman.com/背景照片刷新每个刷新一些JavaScript。然后，我偶然发现了一个酷酷的剪贴蒙版教程。随机背景图片背景剪辑

h1 { 
font-family: Arial; 
font-size: 5em; 
text-align: center; 

background-image: url(Galaxy.jpg); 

-webkit-background-clip: text; 
background-clip: text; 

color: rgba(0,0,0,0);

}

我想使用一个随机图像，它说“Galaxy.jpg”，使以往任何时候都刷新有被修剪过的文本的新形象。

来源

2013-03-13 user1877401

到目前为止没有。我对HTML和CSS非常陌生，我想你可以用Javascript或PHP来做到这一点，但我在那里毫无头绪。 “我一直依赖于陌生人的善良” – user1877401 2013-03-13 00:14:19

这是我将如何处理这个问题，我能想到的唯一解决方案将需要使用jQuery来更改背景图像。

首先，我将创建一个图像名称的数组，你想循环你的背景。我称这个变量为背景。

jQuery代码：

var background = ["Galaxy","Galaxy2","Galaxy3","Galaxy4","Galaxy5"]; 
    var randombackground = Math.floor((Math.random()*5)); 
    /*This will generate a random number between 0 and 4, which we will use to access our array, change the 5 to the number of wallpapers that you have*/ 


$(document).ready(function(){ 
    $("h1").css("background-image","url('" + background[randombackground] + ".jpg')"); 
});

上面的代码会产生一个随机数，其每次都会选择不同的墙纸页面加载。这是因为每次加载页面时随机数字都会更改。请注意，您需要安装http://jquery.com/以使代码正常工作。

希望这会有所帮助。

来源

2013-03-13 00:23:26 grapien

非常感谢。我现在出去了，但我会让你知道它是如何在美国东部时间下午11点左右。 – user1877401 2013-03-13 00:40:37

如果您有任何问题，请告诉我。 – grapien 2013-03-13 00:42:30

因此，我在我的HTML文档中加载了JQuery.min.js，现在在哪里/如何放置此代码？ – user1877401 2013-03-13 03:08:26

随机背景图片背景剪辑

回答

相关问题