StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>Sorry for the delay. I've had a play with this now and the only way I could get it to do what you wanted was entirely in Raphael - perhaps the DOM elements are 'managed' by Rapchael so the jQuery doesn't ever really kick in properly</p> <p><strong>EDIT</strong> I've refactored this to simplify <a href="http://jsfiddle.net/joevallender/v2Ykt/6/" rel="nofollow">http://jsfiddle.net/joevallender/v2Ykt/6/</a></p> <pre><code>var paper = new Raphael(document.getElementById('inter-mapka'), 172, 276); var a1 = paper.path("M9,163.334 L12,163.25 L18.5,157 L80.958,157 L80.958,192 L64.5,192 L9,177.084Z").attr({"title": "budynek A1"}); var a2 = paper.path("M3.875,141H38c0,0,7.75-3.875,10-8c0-4.5,0-18.5,0-18.5s0.375-5.625-11.125-5.625 s-30.719,0-30.719,0L6.125,110H5l-0.012,10.969L3.875,121V141z").attr({"title": "budynek A2"}); var a3 = paper.path("M81.125,93.188h-30c0,0-7.125-1.938-9.25-7.438c0-5.625,0-18.875,0-18.875 S42.503,61.75,48.001,61c5.624,0,33.124,0,33.124,0V93.188z").attr({"title": "budynek A3"}); var a4 = paper.path("M5,39.875l7.875,6H40.75c0,0,8.375-0.25,7.25-7.5c0-7.25,0.104-19,0.104-19L44,10H5V39.875z").attr({"title": "budynek A4"}); var a5 = paper.path("M80,10v30.375c0,0,1.125,5,6,5.5c4.875,0,28.75,0,28.75,0L118.875,40V10H80z").attr({"title": "budynek A5"}); var all = [a1,a2,a3,a4,a5]; for(var i = 0; i < all.length; i++) { all[i].attr({"fill":"#6e3315", "stroke-width": 0, "fill-opacity": 0, 'stroke': '#f00'}); all[i].mouseover( function () { this.animate({"fill-opacity": .7}, 200); }).mouseout(function () { this.animate({"fill-opacity": .0}, 200); }); all[i].click(function(){ clearAll(); this.attr({"stroke-width": 1}); }); } function clearAll(){ for(var i = 0; i < all.length; i++) { all[i].attr({"stroke-width": 0}); } } </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload