tutorial.hu » css

min-device-width CSS gond megoldása Internet Explorer-ben jQuery-vel

Fábián Gábor — Wed, 08 Feb 2012 09:24:13 +0000

Létezik egy technika, amivel különböző felbontású eszközökre külön css stílusokat tudunk meghívni. Példa 1200 pixelnél kisebb és nagyobb méretekre: 1 2 <link rel="stylesheet" media="screen and (max-device-width: 1199px)" href="style.css" /> <link rel="stylesheet" media="screen and (min-device-width: 1200px)" href="style-1200.css" /> A gond az, hogy a designerek kedvenc böngészője, az Internet Explorer fittyet hány erre. Ez a probléma orvosolható egy egészen egyszerű jquery javascript [...]

A min-device-width CSS gond megoldása Internet Explorer-ben jQuery-vel c. cikk eredetileg itt jelent meg: tutorial.hu

CSS Framework, Wordpress theme gyűjtemény és CSS okosságok

Harder — Sun, 07 Nov 2010 08:00:02 +0000

Jöjjön pár gyorshír az elmúlt hétről, amikről legalább említés szintjén szeretnék szót/linket ejteni: css Framework és grid A CSS framework-ökről már volt szó korábban is, alapvetően jó dolognak tartom őket egyes feladatoknál, mert gyorsítanak a sitebuild folyamatán (cross-browser kód, egységes kódolási stílus, ismétlődő feladatok csökkentése stb.) Bár nálam a 2 favorit a 960 és a Blueprint (és inkább [...]

A CSS Framework, Wordpress theme gyűjtemény és CSS okosságok c. cikk eredetileg itt jelent meg: tutorial.hu

Fotógaléria készítése – HTML5, CSS3, jQuery

mrMiller — Fri, 08 Oct 2010 11:23:29 +0000

Sziasztok, üdvözlök mindenkit! Az alábbi leírás bemutatja, hogyan (is) lehet egy igényes, egyedi, “interaktív” fotógaléria-felületet készíteni – háttérképek nélkül. Használt technikák/kiegészítők: html5 css3 jquery jQuery FancyBox A végeredmény a demó oldalon látható, valamint a demó teljes tartalma (forráskódok, képek) letölthetők innen (4760kb). Rögtön az elején megemlíteném, hogy a leírás csak a front-end elkészítését mutatja be, a szerver-oldallal nem foglalkozik. Nem volt továbbá célom [...]

A Fotógaléria készítése – HTML5, CSS3, jQuery c. cikk eredetileg itt jelent meg: tutorial.hu

A legjobb jQuery tooltip pluginek képekben

Gombos Lorand — Thu, 26 Aug 2010 21:26:22 +0000

Egy listát készítettem egy pár jquery tooltip plugin -ról. Leírást ne keressetek, hisz hiszem és vallom: a legjobb leírás, ha a készítő oldaláron elolvassuk a dokumentációt. 1. qTip Honlap :: Demo 2. Tooltip Honlap :: Demo 3. Simpletip Honlap :: Demo 4. BeautyTips Honlap :: Demo 5. jTip Honlap :: Demo 6. jQuery Tools: Tooltip Honlap :: Demo 7. Coda Popup Bubbles Honlap :: Demo 8. Easiest jQuery Tooltip Ever Honlap :: Demo 9. EZPZ Tooltip Honlap :: Demo 10. Tipsy – Facebook-style tooltip Honlap :: Demo A A legjobb jQuery [...]

A A legjobb jQuery tooltip pluginek képekben c. cikk eredetileg itt jelent meg: tutorial.hu

Hosszú linkek és szövegek megtörése

Harder — Sat, 12 Jun 2010 19:24:12 +0000

A Perishable Press oldalon találtam egy nagyon jó megoldást arra, hogy lehet a PRE (illetve bármilyen blokk szintű elem esetében) megtörni a hosszú szövegeket. A különböző böngészőknek különböző white-space értékeket kell adni, de szerencsére ezek “listaszerűen” felsorolhatóak a css-ben: Így néz ki default-ban a hosszú szöveg, sortörés nélkül és az alábbi kód használatával: 1 2 3 4 5 6 7 8 9 10 pre { white-space: pre; [...]

A Hosszú linkek és szövegek megtörése c. cikk eredetileg itt jelent meg: tutorial.hu

CSS3 támogatás IE 6, 7 és 8 böngészőhöz

Harder — Thu, 22 Apr 2010 07:00:22 +0000

A css3 támogatottsága még elég gyatra, főleg IE terén, ezen igyekszik segíteni az alábbi megoldás: Használata 1 2 3 4 5 6 7 8 9 10 11 .box { -moz-border-radius: 15px; /* Firefox */ -webkit-border-radius: 15px; /* Safari and Chrome */ border-radius: 15px; /* Opera 10.5+, future browsers, and now also Internet Explorer 6+ using IE-CSS3 */ -moz-box-shadow: 10px 10px 20px #000; /* Firefox [...]

A CSS3 támogatás IE 6, 7 és 8 böngészőhöz c. cikk eredetileg itt jelent meg: tutorial.hu

CSS 3 gradiens a Firefox 3.6-ban

pkarsai — Thu, 04 Mar 2010 21:28:35 +0000

A gradiensek (színátmenetek) a web 2.0 stílus divatos és jellemzõ eszközei. Remekül alkalmazhatóak a térhatás illúziójának megteremtésére, és ma már szinte minden weboldalon ott vannak. Gradiensek létrehozásához eddig a különbözõ képszerkesztõ programokra voltunk utalva, de a css stílusleíró nyelv 3. számú változata támogatja a gradienseket, így – bizonyos keretek között – ezek a weboldal megjelenítésekor [...]

A CSS 3 gradiens a Firefox 3.6-ban c. cikk eredetileg itt jelent meg: tutorial.hu

Primer CSS

Harder — Sat, 23 Jan 2010 10:55:07 +0000

Most találtam ezt a remek kis cuccot amivel lehet gyorsítani a sitebuildeléskor kicsit a folyamatokat. A lényege, hogy amikor megírtad a HTML kódot, akkor a forrásból egy kattintásra lehet generáltatni egy üres css sablont. http://www.primercss.com Katt a “Prime it” gombra és láss csodát: A HTML kódból kiszedi az összes ID-vel vagy CLASS-val ellátott blokkot. Pl. bemásoltam ezt a [...]

A Primer CSS c. cikk eredetileg itt jelent meg: tutorial.hu

Facebook hack Stylish használatával

Harder — Tue, 28 Apr 2009 10:55:15 +0000

Minap találtam egy alkalmazást/módszert arra, hogy lehet átalakítani mások lapját tartósan a firefox-omban.. a Facebook kapcsán jött elő, de persze bármelyik lapon lehet alkalmazni. Persze nem szerverszinten megy a “hack”, csak a monitoromon való megjelenésben történnek változások, lokálisan. Most ezért biztos páran meg fognak kövezni, de szerintem a default Facebook kinézet egyszerűen rossz, nehezen olvasható, úgy [...]

A Facebook hack Stylish használatával c. cikk eredetileg itt jelent meg: tutorial.hu

Menük CSS-el, szabványosan és gyorsan

ViZion — Sun, 15 Mar 2009 05:58:25 +0000

Miért olyan nehéz egy oldal design összeállítása? Mert rengeteg grafikai munka előzi meg, és a sok változatból végül csak egy maradhat… Ebből következik, hogy pl. a menük elkészítésére fordított munka egy része (nagy része) sajnos az indultak még kategóriába kerül. Sok tutorial foglalkozik gombok és menük készítésével, ezek teljesen jók, a célnak megfelelnek, HA van konkrét [...]

A Menük CSS-el, szabványosan és gyorsan c. cikk eredetileg itt jelent meg: tutorial.hu