BG issue
-
@yariplus I am a noob and I am confused. What goes in the header and what part is to be called ?
Putting the entire following thing does not work.
<script>
$(function(){
function ChangeIt(){
var num = Math.ceil( Math.random() * totalCount );
document.body.background = '/images/bgimages/'+num+'.jpg';
document.body.style.backgroundSize = '50 0%%';
document.body.style.backgroundRepeat = 'fixed';
document.body.style.backgroundAttachment='fixed';
document.body.style.MozBackgroundSize = 'cover';
document.body.style.backgroundSize = 'cover';
}// Initial load.
if (app.template === 'login' || app.template === 'register') ChangeIt();// New page loading.
$(window).on('action:ajaxify.start', function (ev, data) {
if (data.url === 'login' || data.url === 'register') {
ChangeIt();
} else {
document.body.background = "#f0f0f0";
}
});
});
</script> -
document.body.background
is actually a url. If you want a color, try changing it todocument.body.style.background
-
I put it in the Custom Header section in the acp.
It should work the same if you put it in header.tpl, near the
useCustomJS
tag -
@yariplus put the entire code in the custom header section, still does not work.
<script>
$(function(){
function ChangeIt(){
var num = Math.ceil( Math.random() * totalCount );
document.body.background = '/images/bgimages/'+num+'.jpg';
document.body.style.backgroundSize = '50 0%%';
document.body.style.backgroundRepeat = 'fixed';
document.body.style.backgroundAttachment='fixed';
document.body.style.MozBackgroundSize = 'cover';
document.body.style.backgroundSize = 'cover';
}// Initial load.
if (app.template === 'login' || app.template === 'register') ChangeIt();// New page loading.
$(window).on('action:ajaxify.start', function (ev, data) {
if (data.url === 'login' || data.url === 'register') {
ChangeIt();
} else {
document.body.style.background = "#f0f0f0";
}
});
});
</script> -
@yariplus corrected a stupid mistake and it seems to work now. But there is yet another issue, if any other page is opened first except the login/register page and if from that page the login/register pages are accessed, they get the same bg i.e the one without an image.
-
Try not using
document.body.background
use
document.body.style.background = "url(http://theurl/image.png)"
-
document.body.style.background = "url(http://theurl/image.png)"
document.body.style.background = "url('/images/bgimages/'+num+'.jpg');
does not work.but
document.body.background = '/images/bgimages/'+num+'.jpg';
works -
document.body.style.background = 'url(/images/bgimages/'+num+'.jpg)';