<div>
if the logo is in the background it is not in the foreground that can be acted upon. <br />
I would think out your reasoning from going away from the web page standard that users are expecting i.e. logo in top left corner.
</div>


Fractional CTO

David Favor

hrolsons

<div>
As both comment above suggest... clicks can only be captured when an element has &quot;focus&quot;... which suggests it's in foreground... so this will be incredibly tricky...<br />
<br />
I suppose you could change from using the image via background-image to an overlay using z-index to place the image over the page... then use opacity of transparency to bleed the page through the image...<br />
<br />
Geez... this seems like a lot of trouble...<br />
<br />
Can it be done? Yes!<br />
<br />
Is the time/budget/will/expertise<wbr /> required worth it? Only you can answer this.<br />
<br />
Also... technically... this can only work if the logo image covers the entire page + has focus, so no other interactive page elements will work until the initial click to the logo... generates a focus change to some other element.<br />
<br />
Best to keep this in mind as you ruminate on your best course of action.
</div>


<div>
<div class="content wysiwyg-content fr-view">
<p>For various reasons I'm displaying our logo in the body background</p><p><br></p><pre><code class="code-1 nolinks" id="code-10-29223106-1"><span>body {<br id="isPasted">&nbsp;background-image: url("logo5.jpg");</span>
<span>&nbsp;background-repeat: no-repeat;</span>
<span>&nbsp;background-position: left top;&nbsp;</span>
<span>}</span>
</code></pre><p>Since it's not a normal IMG tag, how do I define the hyperlink that happens when the user clicks the logo?&nbsp; Do I need to draw an invisible clickable box in the top left?</p>
</div>
</div>



For various reasons I'm displaying our logo in the body background
body {
 background-image: url("logo5.jpg");
 background-repeat: no-repeat;
 background-position: left top; 
}
Since it's not a normal IMG tag, how do I define the hyperlink that happens when the user clicks the logo?  Do I need to draw an invisible clickable box in the top left?

Click Logo on website using css?

Cascading Style Sheets (CSS) is a language used for describing the look and formatting of a document written in a markup language. Usually used to change web pages and user interfaces written in HTML, it can also be applied to any kind of XML document. CSS is designed primarily to distinguish the content of a document from its presentation.

HTML (HyperText Markup Language) is the main markup language for creating web pages and other information to be displayed in a web browser, providing both the structure and content for what is sent from a web server through the use of tags. The current implementation of the HTML specification is HTML5.