lekerekitett sarkok + DOM manipuláció
A következő problémával kapcsolatban várom a segítségeteket:
Extra tag-ek használatával (lásd: http://www.webreference.com/programming/css_borders/index.html)
építettem flexibilis lekerekített sarkú dobozokat.
Ez tök jól működik, de a plusz tag-ek (<b></b>) miatt nem szép.
DOM/DHtml manipulációval futásidőben létrehozhatók a szükséges tag-ek, a helyzet itt bonyolódik el.
FF és Opera8 alatt tökéletesen, elvárásaim szerint működik a következő javascript:A legkevésbé sztenderd böngésző az első .removeChild() sornál
vagyis itt:
Type Mismatch hibajelzéssel elakad.
Azért gondolom, hogy itt, mert ha enterekkel lejjebb viszem ettől a sortól, a hibaüzenet helye is "lejjebb megy".
Én tudom rosszul, vagy az IE?
Mi a megoldás?
Hiába az elegáns(abb) megoldás, ha az IE (piaci részesedése) miatt nem használhatom. :(
Köszönettel: teamtom
■ Extra tag-ek használatával (lásd: http://www.webreference.com/programming/css_borders/index.html)
építettem flexibilis lekerekített sarkú dobozokat.
Ez tök jól működik, de a plusz tag-ek (<b></b>) miatt nem szép.
DOM/DHtml manipulációval futásidőben létrehozhatók a szükséges tag-ek, a helyzet itt bonyolódik el.
FF és Opera8 alatt tökéletesen, elvárásaim szerint működik a következő javascript:
- function roundedCorners() {
- var divs = document.getElementsByTagName('div');
- var rounded_divs = [];
- // az összes "tesztbox" osztályú div megkeresése
- for (var i = 0; i < divs.length; i++) {
- if (/\btesztbox\b/.exec(divs[i].className)) {
- rounded_divs[rounded_divs.length] = divs[i];
- }
- }
- for (var i = 0; i < rounded_divs.length; i++) {
- var original = rounded_divs[i];
- var originalscontent = rounded_divs[i].childNodes[1];
- original.removeChild(originalscontent); // az IE itt akad el;
- // az eredeti tartalom törlése
- while (original.firstChild!=null) {
- original.removeChild(original.firstChild);
- }
- var bfelette1 = document.createElement('b');
- bfelette1.className='b1';
- var bfelette2 = document.createElement('b');
- bfelette2.className='b2';
- var bfelette3 = document.createElement('b');
- bfelette3.className='b3';
- var bfelette4 = document.createElement('b');
- bfelette4.className='b4';
- var balatta1 = document.createElement('b');
- balatta1.className='b5';
- var balatta2 = document.createElement('b');
- balatta2.className='b4';
- var balatta3 = document.createElement('b');
- balatta3.className='b3';
- var balatta4 = document.createElement('b');
- balatta4.className='b2';
- var balatta5 = document.createElement('b');
- balatta5.className='b1';
- original.appendChild(bfelette1)
- original.appendChild(bfelette2)
- original.appendChild(bfelette3)
- original.appendChild(bfelette4)
- original.appendChild(originalscontent);
- original.appendChild(balatta1)
- original.appendChild(balatta2)
- original.appendChild(balatta3)
- original.appendChild(balatta4)
- original.appendChild(balatta5)
- }
- }
- window.onload = roundedCorners;
vagyis itt:
original.removeChild(originalscontent);
Type Mismatch hibajelzéssel elakad.
Azért gondolom, hogy itt, mert ha enterekkel lejjebb viszem ettől a sortól, a hibaüzenet helye is "lejjebb megy".
Én tudom rosszul, vagy az IE?
Mi a megoldás?
Hiába az elegáns(abb) megoldás, ha az IE (piaci részesedése) miatt nem használhatom. :(
Köszönettel: teamtom
Egy tipp
--
Ámon Tamás - http://amon.hu
Lekerekitett sarkok + DOM manipuláció megoldása
a fenti szkript 13. sorában:
az IE valószínűleg nem kezeli extra node-ként ezeket, mert amikor az originalscontent-et nem feltételezett sorszámával, hanem az osztálynevével azonosítva képeztem, már az IE is megtalálta.
Tehát a 13. sor definicióját az alábbival kell helyettesíteni: