Nová ukázka
Reset
Načíst z URL
Uložit a získat odkaz
Vztahuje se k…
Nevyplňujte
Napiště „nejsem robot“
▶
Přepnout zobrazení
Výsledek
<title>Responsivní Facebook Like tlačítko</title> <h1>Responsivní Facebook Like tlačítko</h1> <p>Facebook tlačítko dostane při načtení šířku podle dostupného prostoru.</p> <div id="fb-root"></div> <script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/cs_CZ/sdk.js#xfbml=1&version=v2.4"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script> <div class="fb-plugin-cover" id="fb-plugin-cover"> <div class="fb-like" data-href="http://jecas.cz/responsivni-facebook" data-layout="standard" data-action="like" data-show-faces="true" data-share="true"></div> </div>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
.fb-plugin-cover { background: #efefef; width: 100%; max-width: 500px; }
CSS
Autoformát
CSS reset
Až na konci
var fbCover = document.getElementById("fb-plugin-cover"); var fbCoverWidth = fbCover.offsetWidth; fbCover.getElementsByTagName("div")[0].setAttribute( "data-width", fbCoverWidth );
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>