Transofrmar un docmuent XML amb XSL usant JavaScript

1er cal tenir en un "document" l'xsl i en un altre l'xml.

una opció és usar l'xmlHttpRequest per carregar-los.

Després per tranformar l'XML obtingut amb l'XmlHttpRequest el següent codi ho fa usant l'XSL carregat anteriorment.

var target = document.getElementById(gObjId);
xmlRef = xmlhttp.responseXML;

target.innerHTML = "";
var outputXHTML = null;
if (window.ActiveXObject)
{
outputXHTML = xmlRef.transformNode(gXSLT);
target.innerHTML = outputXHTML;
}
else
{
outputXHTML = gXSLT.transformToFragment(xmlRef, document);
target.appendChild(outputXHTML); // .innerHTML= outputXHTML.textContent;//
}

Per carregar elXSLTProcessor (gXSLT) cal fer:


gXSLT = new XSLTProcessor();
// carregar l'XSL en el document xslRef
gXSLT.importStylesheet(xslRef);


Es pot trobar com fer-ho a:
http://www.codingforums.com/showthread.php?t=91403

Rounded Borders

http://www.curvycorners.net/

Només cal utilitzar les llibreries que utilitzen.
La capa que es vol arrodonir ha de ser d'una classe determinada i per javascript s'arrodoneix.


també hi ha, entre d'altres:

http://www.malsup.com/jquery/corner/



Després de barallar-s'hi una mica aquest codi funciona bé en Firefox i en IE...

<script type="text/javascript" src="../js/jquery-1.2.1.js"></script>
<script type="text/javascript" src="../js/jquery.corner.js"></script>
<script type="text/JavaScript">
$(document).ready(function(){
if (document.all){
$("div.capa").css('margin', '4px').corner("round 8px").parent().css('padding-top', '4px').corner("round 10px");
}else{
$("div.capa").css('padding-top', '4px').css('padding-bottom', '4px').corner("round 8px").parent().css('padding', '4px').corner("round 10px");
}
});
</script>

<style>
.marcCapa{
background-color:#9411D2; /* Color del borde*/
}
.capa{
background-color:#fff; /* Color de fons del marc.*/
}
body {
background:black;
}
</style>

.....
.....
<div class="marcCapa">
<div class="capa">
<div id="contingut">
<p>
Prova de capa amb bordes de color.
</p>
</div>
</div>
</div>

scrollbar color

Només funciona en explorer i potser Konqueror de Linux.


body
{
scrollbar-base-color: #000000;
}

Incloure tipografia

Importar la tipografia:

@font-face {
font-family: "J.D.- Closer/LWTUA";
src: url('C:\Documents and Settings\..\font.ttf');
}

Carregar la font:

font-family: "J.D.- Closer/LWTUA";