Ik heb zojuist eens gekeken naar Expression Web van Microsoft. Het leek mij leuk om een stukje code te tonen dat gegenereerd wordt als je een zgn. Interactive Button toevoegt aan je pagina:
Wat opvalt is dat de functie FP_getObjectByID wel netjes de browser test door direct de DOM te testen. Let ook even op het voorvoegsel FP, Frontpage is nog steeds aanwezig , daar zullen veel mensen niet blij van worden. Verder worden eventhandlers direct op het element gedeclareerd, iets wat ik toch graag anders zie (zgn. unobtrusive javascript). Let als laatste nog even op het commentaar direct na de Interactive Button, dit is nodig voor Expression om in de Design View aan te kunnen geven dat dit een bijzonder element is.
Kortom, als je geen fan was van Frontpage of Dreamweaver vanwege de code die het genereert, dan zou ik eerst maar eens de trial van Expression Web proberen voordat je het koopt. Want veel is er niet veranderd op dat gebied, hoewel de CSS ondersteuning wel een stuk slimmer is geworden.
JavaScript:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
| function FP_swapImg() {//v1.0 var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array(); for(n=2; n<args.length; n+=2) { elm=FP_getObjectByID(args[n]); if(elm) { doc.$imgSwaps[doc.$imgSwaps.length]=elm; elm.$src=elm.src; elm.src=args[n+1]; } } } function FP_preloadImgs() {//v1.0 var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array(); for(var i=0; i<a.length; i++) { d.FP_imgs[i]=new Image; d.FP_imgs[i].src=a[i]; } } function FP_getObjectByID(id,o) {//v1.0 var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById) el=o.getElementById(id); else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el) return el; if(o.id==id || o.name==id) return o; if(o.childNodes) c=o.childNodes; if(c) for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el) return el; } f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements; for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]); if(el) return el; } } return null; } |
HTML:
1
2
3
4
| <body onload="FP_preloadImgs(/*url*/'file:///C:/Documents and Settings/username/Local Settings/Temporary Internet Files/WebTempDir/button19.jpg',/*url*/'file:///C:/Documents and Settings/username/Local Settings/Temporary Internet Files/WebTempDir/button1A.jpg')"> <form id="form1" runat="server"> <img style="border: 0" id="img1" src="file:///C:/Documents%20and%20Settings/username/Local%20Settings/Temporary%20Internet%20Files/WebTempDir/button18.jpg" height="33" width="100" alt="Button Text" onmouseover="FP_swapImg(1,0,/*id*/'img1',/*url*/'file:///C:/Documents and Settings/username/Local Settings/Temporary Internet Files/WebTempDir/button19.jpg')" onmouseout="FP_swapImg(0,0,/*id*/'img1',/*url*/'file:///C:/Documents and Settings/username/Local Settings/Temporary Internet Files/WebTempDir/button18.jpg')" onmousedown="FP_swapImg(1,0,/*id*/'img1',/*url*/'file:///C:/Documents and Settings/username/Local Settings/Temporary Internet Files/WebTempDir/button1A.jpg')" onmouseup="FP_swapImg(0,0,/*id*/'img1',/*url*/'file:///C:/Documents and Settings/username/Local Settings/Temporary Internet Files/WebTempDir/button19.jpg')" /><!-- MSComment="ibutton" fp-style="fp-btn: Soft Tab 5" fp-title="Button Text" --> |
Wat opvalt is dat de functie FP_getObjectByID wel netjes de browser test door direct de DOM te testen. Let ook even op het voorvoegsel FP, Frontpage is nog steeds aanwezig , daar zullen veel mensen niet blij van worden. Verder worden eventhandlers direct op het element gedeclareerd, iets wat ik toch graag anders zie (zgn. unobtrusive javascript). Let als laatste nog even op het commentaar direct na de Interactive Button, dit is nodig voor Expression om in de Design View aan te kunnen geven dat dit een bijzonder element is.
Kortom, als je geen fan was van Frontpage of Dreamweaver vanwege de code die het genereert, dan zou ik eerst maar eens de trial van Expression Web proberen voordat je het koopt. Want veel is er niet veranderd op dat gebied, hoewel de CSS ondersteuning wel een stuk slimmer is geworden.