本站消息

站长简介/公众号


站长简介:逗比程序员,理工宅男,前每日优鲜python全栈开发工程师,利用周末时间开发出本站,欢迎关注我的微信公众号:程序员总部,程序员的家,探索程序员的人生之路!分享IT最新技术,关注行业最新动向,让你永不落伍。了解同行们的工资,生活工作中的酸甜苦辣,谋求程序员的最终出路!

 价值13000svip视频教程,前端大神匠心打造,零基础前端开发工程师视频教程全套,基础+进阶+项目实战,包含课件和源码

  出租广告位,需要合作请联系站长


+关注
已关注

分类  

暂无分类

标签  

暂无标签

日期归档  

暂无数据

Tumblr 主题中 CSS 背景中的随机图像

发布于2021-09-14 12:30     阅读(1027)     评论(0)     点赞(16)     收藏(5)


这个问题以前可能有人问过,但我是一个完整的 HTML 菜鸟,我找到的答案都没有帮助我。

在我的 Tumblr 主题中,标题设置如下:

.siteHeader {
        {block:ifShowHeaderImage}
        background: url({HeaderImage}) no-repeat center center {block:ifFixedHeaderBackground}fixed{/block:ifFixedHeaderBackground};
        background-size: cover;
        {/block:ifShowHeaderImage}
        color: {color:Header Text};
    }

{HeaderImage}参照的tumblr基础设施中存在的tumblr的预设账户标题图片。我希望我的实际主题上的标题图像在已经托管在 Tumblr 上的多个图像中随机化,并且我有直接的 URL。

有人可以指导我如何实现这一点吗?我发现了很多 Javascript 脚本,但它们只能用于替换<img src>和大量 PHP 脚本,但 Tumblr 不支持这些脚本。

提前致谢。


解决方案


您可以使用 jquery 更改 CSS 参数。

 $('.siteHeader').css( "background-image", "url(yourURL)" );

或者如果它是一个变量

 $('.siteHeader').css( "background-image", "url(" + yourURLVariable + ")" );

这是一个带有数组的完整示例。如果您使用它,请忽略上面的任何内容。

 // Fill in the URL to your images here in place of 'url1', 'url2' and so on
 var urlArray = [
   'url1',
   'url2'
 ];

 // Script selects a random number here on it's own
 var randomNumber = Math.floor(Math.random() * urlArray.length);
 // Script now sets the background-image css with jQuery here
 $('.siteHeader').css( "background-image", "url(" + urlArray[randomNumber]+ ")" );



所属网站分类: 技术文章 > 问答

作者:黑洞官方问答小能手

链接:http://www.qianduanheidong.com/blog/article/190530/8408bfa90472b45ed879/

来源:前端黑洞网

任何形式的转载都请注明出处,如有侵权 一经发现 必将追究其法律责任

16 0
收藏该文
已收藏

评论内容:(最多支持255个字符)