preloadCssImages()

2009.06.11. 20:43 stack

A legeslegelső JavaScript próbálkozásom - legalább tíz éve - egy képnél az egér események lekezelése volt. Egérrel a kép felé mentünk és megváltozott a kép. Nagyon örültem, amikor sikerült. :)  Rögtön a második script ezután az volt, hogy betöltöttem ezeket a képeket a memóriába, hogy ne csak a mouseover eseménykor induljon el a letöltés.

Nosztalgikus hangulatba kerültem, amikor azzal a feladattal szembesültem, hogy az egyik alkalmazásban lassú net esetén egy-egy kép zavaróan lassúan jön le, és ezért jó lenne az egyik CSS fájlban lévő képeket előre letölteni.

Az alap script-et még régebben az Ajaxian-on láttam, de két okból át kellett alakítani. 1. a JQuery-t lecseréltem Ext-base -re. 2. nekem csak egyetlen egy CSS fájlban lévő képekre volt szükségem, a teljes ext-all.css tartalmára nem.

Szólj hozzá!

Címkék: css image preload

Eszköz gombok

2009.05.06. 09:32 stack

Egy ablak vagy egy panel elemhez nem csak a szokványos bezár, összecsuk stb. eszköz gombokat lehet hozzárendelni, hanem még egy tucat másikat. Kérdőjelet, fogaskereket és még ki tudja miket... már sokadszorra fordult velem elő, hogy a "ki tudja mik"-en gondolkodtam, majd minden alkalommal eldöntöttem, hogy ezeket valahol összegyűjtöm.

A doksiban fel van sorolva a lista. Ám mégiscsak többet nyújt, ha az ember látja is maga előtt ezeket.
Az, hogy miket használhatunk, legegyszerűbben úgy nézhetjük meg, hogy a css szabályok között kikeressük azokat, melyek .x-tool-akármi alakúak.

2 komment

Címkék: css tools

MeasureIt.zIndex

2009.03.13. 15:01 stack

ExtJS-ben az ablakok alapértelmezetten 9000-es z-index-szel jelennek meg. (Ext.WindowMgr.zseed) Egészen addig nem is volt ez érdekes számomra, míg nem akartam a vonalzóval (MeasureIt) megméri valaminek a szélességét. Nem tudom, hogy honnan vehették az alapértelmezett z-index-et, de jelen helyzetben kevésnek bizonyul a 4721-es érték. Megoldás lehetne a Window Maneger értékét módosítani, de egyszerűbbnek tűnik a vonalzót "magasabbra" vinni:

#measureit_back {
    z-index: 10000 !important;
}
#measureit_box,
#measureit_toolbar {
    z-index: 10001 !important;
}

Szólj hozzá!

Címkék: css zindex firefox extension

button.iconAlign: right

2009.02.17. 09:21 stack

Szinte csak új típusú komponensek készítésekor foglalkozok CSS szabályok írásával, máskülönben mindig az ExtJS alapértelmezett elemeit használom. Meg is lepődtem, amikor egy olyan feladat előtt álltam, ami egy az egyben CSS-sel megoldható, mégpedig gomboknál kellett az ikont jobb oldalra helyezni. Bár úgy is mondhatnám, hogy meglepődtem, amiért ezt nekem kellett megírni, és nem volt benne az ExtJS-ben alapértelmezetten. :)

Tehát a CSS kiegészítés:

table.x-btn-icon-right button {
    background-position: right 2px !important;
    padding-left: 0 !important;
    padding-right: 18px !important;
}

Szólj hozzá!

Címkék: css button icon

Ext.ux.iconCls

2008.10.12. 11:20 stack

Sosem értettem, hogy miért kell a icon és az iconCls-t így túlbonyolítani, bőven elég lenne csak az egyik (az icon), ám mégis néhol mindkettő van, néhol meg csak az iconCls.

Az ötlet, hogy készítsek egy singleton osztályt ennek a dilemmának a feloldására nem saját, ám a több megoldás közül egyik sem tetszett, így hát íme a száz plusz egyedik leegyszerűsített Ext.ux.iconCls:

Szólj hozzá!

Címkék: css icon class

ExtJS blog, mi ez?

Az ExtJS egy JavaScript keretrendszer, melyet a blog írója elfogultan a legjobbnak tart, és ez a blog olyan apróságok gyűjteménye, melyek ExtJS használata közben felmerültek, eszébe jutottak...

Címkék

ajax (4) alignto (1) állás (3) analytics (1) anchorto (1) android (4) animate (2) array (9) auto (1) back button (1) beautifier (1) beforeevent (1) benchmark (1) blur (1) budapest.js (1) button (1) canvas (1) capture (1) case sensitive (1) center (1) change (1) cikkajánló (1) class (2) closure compiler (1) collapse (1) combobox (3) comment (1) console.log (2) contextmenu (2) core (2) count (1) css (15) csv (1) dataview (1) date (4) datefield (3) datepicker (1) debug (1) doksi (1) dragdrop (1) easing (1) eclipse (1) editor (1) element (5) error (5) eval (2) event (1) fejtörő (1) field (2) fieldset (1) filter (1) firefox (4) firefox extension (2) focus (3) fonts (1) fun (1) function (1) google (2) google chrome (1) grayscale (1) grid (4) group contact (1) header (3) height (2) hidden (1) hirek (2) history (1) htaccess (1) html5 (2) htmleditor (2) https (1) icon (3) id (2) ie (2) ie6 (1) ie9 (1) iframe (3) image (2) indexof (1) javascript (1) jquery (2) jslint (2) jsmin (1) json (7) keymap (1) kipróbálom (2) könyvajánló (2) label (1) layout (1) lint (1) log (1) loop (1) magyar (2) mandelbrot (1) mask (1) math (1) maxlength (1) mistake (1) mysql (5) napi szívás (16) nem extjs (12) node (1) nth child (1) number (1) off (5) offline (1) operator (1) override (20) pagesize (1) paging (2) panel (2) php (7) picker (1) plugin (3) pozicionálás (2) preload (1) print (1) propertygrid (1) pseudo (3) readonly (2) record (1) regexp (1) replace (1) resizable (1) rotate (1) round (1) scale (1) sencha touch (2) server (1) shuffle (1) slider (1) sort (3) sortable (1) store (2) string (7) sum (1) tabchange (1) tabpanel (1) tab key (2) tdd (1) template (1) textarea (2) textfield (1) textitem (1) theme (2) throw (1) timer (1) timestamp (1) title (2) toggle (1) toolbar (6) tools (1) total count (1) transparent (1) tree (1) treenode (1) trigger (1) truncate (1) try (1) ucfirst (1) undefined (2) unique (1) unload (1) urlencode (1) utf8 (2) verzió (1) video (1) viewer (1) viewport (2) visible (2) vtype (1) window (2) xtype (1) zindex (2)

Extjs.blog.hu - RSS

Kérdés?

süti beállítások módosítása