Ajnasz Blog

Munkám során szoros kapcsolatba kerültem a webfx columnlist javascript alkalmazással.
Annyit a dologról, hogy kibõvíti a html táblázatok képességeit. Segítéségvel megoldható, hogy rendezzük a táblázatot, töröljünk cellákat, átméretezzük az oszlopokat stb.

A projekt során felmerült az igény, hogy amikor a kurzor egy sor fölé érkezik, annak megváltozzon a megjelenése.
A dolgot sikerült megoldani a webfx saját függvényeivel, gondoltam visszaküldöm a script gyártóinak, email röppent, de válasz nem jött, lehet, megdöglött a galamb út közben.
Ezért ide kiteszem mindenkinek, hagy boldoguljon a nép.

A columnlist.js fájl WebFXColumnList.prototype._assignEventHandlers függvényét kell kiegészíteni a következõ pár sorral:
this._eCont.onmouseover = function(e) { oThis._mouseOver(e); }
this._eCont.onmouseout = function(e) { oThis._mouseOut(e); }


A következõek ugyancsak a columnlist.js fájlba kerül(het)nek:

WebFXColumnList.prototype._mouseOver = function(e) {
var el = (e)?e.target:window.event.srcElement;
if ((el.tagName=='TD')&&(el.parentNode.parentNode.parentNode.parentNode.className==webfx-columnlist-body')) {
curStyle = el.parentNode.className;
if(curStyle != 'selected') {
el.parentNode.className = 'over';
}
}
}
WebFXColumnList.prototype._mouseOut = function(e) {
var el = (e)?e.target:window.event.srcElement;
if ((el.tagName=='TD')&&(el.parentNode.parentNode.parentNode.parentNode.className==webfx-columnlist-body')) {
if(curStyle != 'selected') {
el.parentNode.className = curStyle;
}
}
}

Css-ben pedig létre kell hozni a következõ mutatót: .webfx-columnlist-body tr.over td.
Ezzel állítjuk be, hogy milyen legyen a cellák megjelenése mouseover eseménykor.
A függvények a 1.03-as verzióval megjelölt columnlist.js fájlhoz készültek.
A forráskód formázásáért mindenkitõl elnézést kérek, furán mûködik ez a code tag.
Egészségére mindenkinek.