Search code examples
svgraphaelhref

How to <href..> my svg-logo with Raphael?


I'm using a Raphael.js on my site. Take a look logo in the header, please. http://hooche.ru/md2 Code for logo:

<script type="text/javascript">
    window.onload = function() {    
    var r = Raphael(logo); r.attr({href: "http://google.com/", target: "blank"});
        other vector..
        ...
</script>

and html-code for logo^

<div id="logo"></div>

But now, we have: 1 letter = 1 Google link = very much Google links and empty, not clickable spaces around letters in one svg-logo.

How to do: 1 svg-logo = 1 link to somewhere with no empty spaces, for example, div logo have:

width: 190px;
height: 67px;

Solution

  • Replace your div with a link, then you won't need the r.attr() bit either.

    <a id="logo" href="http://google.com/"></a>
    

    (I would not advise using target="_blank" there. It's not the standard behaviour. Let the end user choose.)