Всплывающий слой (DIV)

Для отображения всплывающих подсказок и элементов предосмотра можно использовать всплывающий слой
preview.css

.previewbox {       
 position: absolute;       
 background-color:#ffffff;       
 border:solid 1px;       
 left: 0;           
 top: 0;                
 width: 400px;      
}


preview.js

 
 function showPreview(ctrlname){       
  content = document.getElementsByName(ctrlname)[0].value;          
  var divIdName = \'previewDiv\';      
  var newdiv = document.getElementById(divIdName);     
  if(!newdiv){         
    newdiv = document.createElement(\'div\');      
    newdiv.setAttribute(\'id\', divIdName);      
    newdiv.setAttribute(\'class\',\'previewbox\');      
    //Hide on click      
    newdiv.onclick = function(){ this.style.display = \'none\';};      
    document.body.appendChild(newdiv);     
  } 
  //Overwrite new content      
  newdiv.innerHTML = content;     
  //Force to show     
  newdiv.style.display =\'\'; 
 } 

HTML:

Название поля (<a href="#" onclick="showPreview(\'htmltextArea\');return false;">HTML Preview</a>)
<br />
<textarea name="htmltextArea">Проверка html <b>Жирный тескт</b> </textarea>

 

0
Your rating: Нет