0

I am trying to set up a way of randomizing the header background image of a website so that whenever it is visited it will be different (with the obvious chance of it being the same if randomly selected). I have researched methods using jQuery, however the location of the background-image is in the pseudo-selector for the class, ::before.

#header-wrapper {
    position: relative;
    background: #080808 url("images/overlay.png") repeat;
    top: 0;
}

    #header-wrapper:before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-image: url("images/foo.jpg");
        background-size: 100% 100%;
        opacity: 0.35;
    }

As of right I have the background-image: to just one, but that what I'm hoping for is to include it among and array of other images.

  • I'd have to look it up but I'm pretty sure that jQuery does fine selecting pseudo-selectors, try `$("#header-wrapper:before")`? – jered Nov 25 '15 at 19:54
  • Pseudo elements are not in the DOM and so are not accessible by Javascript – Paulie_D Nov 25 '15 at 20:01

0 Answers0