There’s probably several ways. Here’s one idea:
Create a div and style it to be position absolute, give it the image width and height, and top:45%; left:45%; (or something to help center it) and use a css background image. The problem with this approach is as the viewport changes, so does the position of the absolutely positioned div (becuse its position is based on either a parents set position if it has it or to the body tag).
Another possibility would be to have a div overlay with your image in the center (position:absolute; top:0; bottom:0; left:0; right:0;) and then add in some javascript to hide the div once clicked so users can interact with the content below.
Hi @bemdesign. I can probably implement your first suggestion, but I think your second suggestion is a better solution for what I’m attempting to do. Is a div ‘overlay’ a special kind of div?? Could you advise me on the javascript? Thanks!
I added
<div id="homelogo"></div>
to the homepage content text view.
And
#homelogo {
position: absolute;
background-image:url("http://www.juntobyob.com/wp-content/uploads/2014/03/junto-large-logo.png");
height:45%;
top:45%;
left:45%;
}
to my style sheet, but there’s no sign of the logo on my home page. Am I doing something wrong?