StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
primarykey
Id
13725150
data
AcceptedAnswerId
0
AnswerCount
0
ClosedDate
CommentCount
0
CommunityOwnedDate
CreationDate
2012-12-05T14:13:39.077
FavoriteCount
0
LastActivityDate
2012-12-05T14:13:39.077
LastEditDate
LastEditorUserId
0
OwnerUserId
1728830
ParentId
13707650
PostTypeId
2
Score
0
ViewCount
0
LastEditorDisplayName
text
Body
<p>In my opinion, the more elegant solution would be to use CSS3 animation instead of jQuery (<a href="http://tinkerbin.com/8sLpzuzM" rel="nofollow">see Tinkerbin</a>):</p> <pre><code><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="956px" height="745px" > <style type="text/css"> a > image { opacity: 0; pointer-events:none; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; } a > polygon { opacity:0; } a:hover > image { pointer-events:auto; display:inline; opacity: 1; } </style> <image x="0" y="0" width="956" height="745" xlink:href="http://www.kollegetown.com/themes/kollegetown/images/img1.jpg" />  <a xlink:href="/team" target="new"> <image id="team" x="63" y="284" width="204" height="365" xlink:href="http://www.kollegetown.com/themes/kollegetown/images/homeRollover_team.jpg"/> <polygon points="189 383, 185 345, 155 316, 209 281, 211 244, 289 210, 291 241, 348 245, 397 290, 391 299, 344 276, 345 369, 365 385, 330 404, 313 438"/> </a>  <a xlink:href="/corporate" target="new"> <image id="corp" x="33" y="29" width="356" height="221" xlink:href="http://www.kollegetown.com/themes/kollegetown/images/homeRollover_corporate.jpg"/> <polygon points="18 126, 86 125, 186 180, 190 271, 99 327, 31 330, 18 321"/> </a>  <a xlink:href="/campusbooster" target="new"> <image id="shops" x="423" y="186" width="497" height="213" xlink:href="http://www.kollegetown.com/themes/kollegetown/images/homeRollover_shops.jpg"/> <polygon points="425 60, 427 209, 470 226, 469 246, 483 251, 506 235, 534 244, 595 214, 600 191, 612 188, 621 201, 633 196, 631 23, 624 17, 504 17"/> </a>  <a xlink:href="/designs" target="new"> <image id="design" x="496" y="407" width="331" height="321" xlink:href="http://www.kollegetown.com/themes/kollegetown/images/homeRollover_gallery.jpg"/> <polygon points="503 509, 438 547, 440 691, 481 710, 482 729, 647 729, 647 582"/> </a> </svg> </code></pre> <p>There is a glitch with Opera, it does not make the overly images sensitive for mouse events on hover. But the user can still click on the building to follow the link. Couldn't test IE9 (problems with my Win7 Notebook).</p>
Tags
Title
singulars
PostAcceptedAnswerId
1. This table or related slice is empty.
PostParentId
1. POSVG Calling JavaScript in Concrete 5
  singulars
  PostTypePostTypeId
  PTQuestion
PostTypePostTypeId
1. PTAnswer
UserLastEditorUserId
1. This table or related slice is empty.
UserOwnerUserId
1. USThomas W
plurals
PostLinksPostIdRelatedPostId
1. This table or related slice is empty.
PostLinksRelatedPostIdPostId
1. This table or related slice is empty.
PostsAcceptedAnswerId
1. This table or related slice is empty.
PostsParentIdCreationDate
1. This table or related slice is empty.
VotesPostIdCreationDate
1. This table or related slice is empty.
CommentsPostId
1. This table or related slice is empty.

Querying!

Guidance

A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.