Gregg
Gregg

Reputation: 495

How can I do something similar to this?

I like the way ZDnet has the social sharing buttons on the left side (if your browser is wide enough), but when you shrink the browser, the buttons jump into the article.

Example: http://www.zdnet.com/blog/btl/mcafee-threats-report-android-is-in-the-crosshairs/63813?tag=content;selector-blogs

Does anyone know if this is a plugin I can download for Wordpress?

If not, is this easy to do in jQuery?

Upvotes: 1

Views: 59

Answers (2)

victoroux
victoroux

Reputation: 286

Why don't you try using media element size so that if the browser's window is too small you make the vertical one disappear using "display: none" and the horizontal appear using "display: block"

Here's a short example to get you started: http://css-tricks.com/6206-resolution-specific-stylesheets/

Write your page to have both in html but only to display one or the other according to browser width in your CSS using media-type

Upvotes: 0

Amir Raminfar
Amir Raminfar

Reputation: 34149

This is done with window's on resize event. If you look at the source code, #siu-horizontal starts not visible, but when the windows gets small it becomes visible. Using jQuery, you can do this pretty easy:

$(window).resize(function() {
  // Look the page width and show the right div
});

Upvotes: 1

Related Questions