Category: JS CSS

Jak zmenit velikost (i castecneho) obsahu na strance

Radek Jančík August 16, 2015 0

1) Pridejte ke prvkum ktere chcete priblizit/oddalit tridu post-single-content-inner . Ja jsem to udelal tak, ze jsem vytvoril 600px obalujici div a do neho dal div se tridou post-single-content-inner. 2) Nastavte tride post-single-content-inner sirku vzdy 100%:

.post-single-content-inner { width: 100% !important; }

1	.post-single-content-inner { width: 100% !important; }

3) Vytvorte na strance tlacitka pro ovladani velikosti:

<div class="text-size"> <a href="#" id="decfont">A-</a> 
<a href="#" id="defaultfont">A</a> 
<a href="#" id="incfont">A+</a> </div>

4) Pridejte tento JavaScript:

jQuery('#incfont').click(function () {
	jQuery('.post-single-content-inner').css('zoom', 1.2);
	return false;
});
jQuery('#decfont').click(function () {
	jQuery('.post-single-content-inner').css('zoom', 0.8);
	return false;
});
jQuery('#defaultfont').click(function () {
	jQuery('.post-single-content-inner').css('zoom', 1);
	return false;
});

jQuery('#incfont').click(function () {

jQuery('.post-single-content-inner').css('zoom', 1.2);

return false;

});

jQuery('#decfont').click(function () {

jQuery('.post-single-content-inner').css('zoom', 0.8);

return false;

});

jQuery('#defaultfont').click(function () {

jQuery('.post-single-content-inner').css('zoom', 1);

return false;

});

Jak pouzit galerii PhotoSwipe v ASP.NET

Radek Jančík June 9, 2015 0

Vcera a asi hodinu dneska jsem se zaobiral pouzitim responzivniho, zoomovatelneho, mobile-friendly, reseni pro zobrazeni fotografii bez neustaleho nacitani z DB vsech fotek pri zobrazeni kazde fotky. Ono to uz bylo hotove vcera v 8 vecer, ale melo to jedno chybu – kdyz jste sdileli stranku treba s pid(Photo ID) 1, a nekdo na to …

Jak zacit pouzivat balickovaci system Node.js npm, Ruby gem a automatizacni system ukolu Grunt

Radek Jančík June 7, 2015 0

Postup budu popisovat pro Windows 8 pro build souboru tohoto jQuery pluginu: https://github.com/dimsemenov/photoswipe . 1) Stahnete si instalator Node.js pro vasi verzi Windows z https://nodejs.org/download/ a nainstalujte vsechny soucasti. Jedna ze soucasti je balickovaci system npm a druha je ulozeni cesty ke Node.js do systemove promenne PATH a cestu k npm do uzivatelske promenne PATH. …

TinyMCE je uzasny aneb jak se s nim pracuje

Radek Jančík May 18, 2015 0

Vcera v noci jsem se zase docela trapil. Jsem si usmyslel ze uz nebudu pouzivat zadny prvek z Ajax Control Toolkit, protoze to je vsechno dost zmatene a porad jsem musel bojovat se konflikty nazvu css trid s jinymi CSS Frameworky hlavne. Zacal jsem tedy hledat novy html editor – bylo mi jedno zda bude …

Onmouseover ani onmouseout nefunguje ve Chrome

Radek Jančík January 27, 2015 0

Onmouseover ani onmouseout nefunguje ve Chrome, zato v IE 11/FF35 bez problemu. Zkousel jsem tyto postupy: JQuery: -Metodu hover() s parametrem In i Out, nebo jen s In -Pouzit jiz existujici objekt jQuery, nebo vytvorit novy, nebo pouzit $(this) -Pouzit .on(“onmouseover”), .on(“onmousehover”), .on(“onmouseout), tak samo s bind(eventType) Cisty Javascript bez jQuery: -Dat onmouseover a onmouseout …

Nejlepsi a nejjednodussi popup jen pomoci CSS

Radek Jančík December 24, 2014 0

CSS kod:

.showonhover .hovertext { display: none;}
.showonhover:hover .hovertext {display: inline;}
.hovertext {position:absolute;z-index:1000;border:1px solid #ffd971;background-color:#fffdce;padding:11px;width:500px;left: 250px; font-size: 0.75em;}

.showonhover .hovertext { display: none;}

.showonhover:hover .hovertext {display: inline;}

.hovertext {position:absolute;z-index:1000;border:1px solid #ffd971;background-color:#fffdce;padding:11px;width:500px;left: 250px; font-size: 0.75em;}

HTML kod:

<span class="showonhover">
<a href="#"> ... </a>
<span class="hovertext">Text zobrazeny po najeti na 3 tecky</span>
</span>

<span class="hovertext">Text zobrazeny po najeti na 3 tecky</span>

</span>

Cele to muzete vyzkouset… zdeText zobrazeny po najeti na 3 tecky

Nejlepsi a nejjednodussi zpusob dynamicky prizpusobiveho layoutu stranky

Radek Jančík December 1, 2014 0

Na svem webu jsem se vzdycky vyhybal pouziti hodnot display zacinajici na table. To byla ale evidentne chyba. Proto vam tu dnes prinasim navod, jak udelat sloupce tak, aby kdyz treba JavaScriptem pridate nejaky obsah, aby se #content automaticky zvetsil na vysku bez jakekoliv vypocitani JavaScriptem vysky nebo jine JS kejkle.

Metro UI CSS – Vytecny produkt, ale spatna dokumentace

Radek Jančík April 7, 2014 0

Pouzivam rad Metro UI CSS FW. Prevedl jsem si pod nej vsechny svoje weby na sunamo.net . Ale jedna vec me na nem docela casto stve. Nedokonala dokumentace. Kouknete se treba na http://metroui.org.ua/datepicker.html . Z teto stranky jde videt ze se musi dat v prve rade se musi pridat reference na tyto js soubory: metro-calendar.js …

Jak naprogramovat multibarevnou listu pro jakekoliv rozliseni

Radek Jančík November 2, 2013 0

Dnes jsem si dal trochu pauzu od toho predelavani starsich Windows Forms programu na WPF, protoze me to ukrutne nebavilo se prodirat kody, o kterych jsem nevedel proc jsem je kdysi tak naprogramoval a premyslel jsem jak trochu ozivit ten svuj web. Napadlo me ze bych mohl udelat barevnou listu a tu vlozit na kazdou …

Testovani CSS rozvrzeni pro 2 sloupce

Radek Jančík October 4, 2013 0

Protozejsem dnes zazival problemy s nakodovanim stranek, z nichz jedna mela na vysku delsi #content a druha #vmenu a nepomahali ani JS/jQuery skripty, hledal jsem dalsi JS reseni. Doted jsem si myslel(a uprimne jsem se tomu podivoval, ze to je mozne), ze ciste pres CSS to nejde resit, ale toto byl omyl. Pres CSS to …