下面是代码。但我不知道问题出在哪里。每次加载后我都有一组背景图像,它不断变化[这是我的意图]。现在我计划先使用 javascript 加载背景,但我的代码不起作用,尽管它适用于常规样式标签。我不知道这里做错了什么。下面是代码。
下面的代码有效,但需要时间来加载图像
<?php
$bg = array('login_bg.jpg', 'login_bg2.jpg', 'login_bg3.jpg', 'login_bg4.jpg', 'login_bg5.jpg', 'login_bg6.jpg', 'login_bg7.jpg', 'login_bg8.jpg', 'login_bg9.jpg' ); // array of filenames
$i = rand(0, count($bg)-1); // generate random number size of the array
$selectedBg = $bg[$i]; // set variable equal to which random filename was chosen
?>
<style>
body{
background-image:url("<?php echo $base_url; ?>assets/images/<?php echo $selectedBg; ?>");
}
</style>
此代码无效。我这样做是因为我想先加载 BG。
<?php
$bg = array('login_bg.jpg', 'login_bg2.jpg', 'login_bg3.jpg', 'login_bg4.jpg', 'login_bg5.jpg', 'login_bg6.jpg', 'login_bg7.jpg', 'login_bg8.jpg', 'login_bg9.jpg' ); // array of filenames
$i = rand(0, count($bg)-1); // generate random number size of the array
$selectedBg = "$bg[$i]"; // set variable equal to which random filename was chosen
?>
<script>
var img1 = new Image();
img1.src="<?php echo $base_url; ?>assets/images/<?php echo $selectedBg; ?>";
$('body').css('background-image', 'url('+ img1.src + ')');
</script>
最佳答案
你的路径是否正确?
在我的例子中,这将是这样的:
http://localhost/test/assets/images/login_bg.jpg
从这个文件调用:
http://localhost/test/index.php
编辑并接受答案:
您的 JS/jQuery 比您的网站更快。尝试使用 $( document ).ready(function() {
$( document ).ready(function() {
$('body').css('background-image', 'url('+ img1.src + ')');
});
为什么?
因为您的网站将从上到下呈现。如果您有 JS/jQuery 将向您的 HTML 添加内容,但 HTML 尚未呈现,则它不会添加内容,因为 jQuery 将找不到您要操作的元素。
这就是为什么您应该在 HTML 文件的底部包含一个 JS 文件。
但是如果你直接将它添加到你的 <head>
, 你必须用 $( document ).ready(function() {
确保您的 JS/jQuery 能够正常工作。
可能的替代方法是标准的 JS onload 函数:
window.onload = function() {};
关于javascript - 我想先使用 jquery 加载背景,但我的代码似乎不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39631031/