добавление текста для наложения в JavaScript

Question

Я использовал какой-то источник для прозрачного наложения в JavaScript:

function grayOut(vis, options) 
{ 
    var options = options || {}; 
    var zindex = 50; 
    var opacity = 70; 
    var opaque = (opacity/100); 
    var bgcolor = options.bgcolor || '#000000'; 
    var dark=document.getElementById('darkenScreenObject'); 

    if (!dark) { 
    // The dark layer doesn't exist, it's never been created. So we'll 
    // create it here and apply some basic styles. 
    // If you are getting errors in IE see: http://support.microsoft.com/default.aspx/kb/927917 
    var tbody = document.getElementsByTagName("body")[0]; 
    var tnode = document.createElement('div');   // Create the layer. 
     tnode.style.position='absolute';     // Position absolutely 
     tnode.style.top='0px';       // In the top 
     tnode.style.left='0px';       // Left corner of the page 
     tnode.style.display='none';      // Start out Hidden 
     tnode.id='darkenScreenObject';     // Name it so we can find it later 

     tbody.appendChild(tnode); 

     /* 
var pTag = document.createElement("P"); 
     var txtProcessing = document.createTextNode("Processing GIF..."); 
     tnode.appendChild(txtProcessing); 
*/ 
    } 

    if (vis) 
    { 
    // Calculate the page width and height 
    if(document.body && (document.body.scrollWidth || document.body.scrollHeight)) 
    { 
     var pageWidth = document.body.scrollWidth+'px'; 
     var pageHeight = document.body.scrollHeight+'px'; 
    } 
    else if(document.body.offsetWidth) 
    { 
     var pageWidth = document.body.offsetWidth+'px'; 
     var pageHeight = document.body.offsetHeight+'px'; 
    } 
    else 
    { 
     var pageWidth='100%'; 
     var pageHeight='100%'; 
    } 
    //set the shader to cover the entire page and make it visible. 

    dark.style.opacity=opaque;      
    dark.style.MozOpacity=opaque;     
    dark.style.filter='alpha(opacity='+opacity+')'; 
    dark.style.zIndex=zindex;   
    dark.style.backgroundColor=bgcolor; 
    dark.style.width= pageWidth; 
    dark.style.height= pageHeight; 
    dark.style.display='block'; 

    var txt = document.createTextNode("This text was added."); 
    dark.appendChild(txt); 
    } 
    else 
    { 
    dark.style.display='none'; 
    } 
} 

Моя проблема в том, что я пытаюсь получить некоторый текст, чтобы показать на прозрачном слое, но я могу не получится. Есть предположения?

Answer 1

Ваш текстовый узел создан на оверлее, но является невидимой причиной цвета текста.

отметьте Fiddle, где цвет текста установлен на красный.

dark.style.color = 'red';