Hi!
Sorry for my bad english!
How to make a button (source code) that when someone clicks on it, it shows the source code of that what is written.
(On some buttons I put the image (<input type="image" src="image.bmp" onclick="urediFont('justifyleft');">) (alignment:left, center, right). But when I click on them everthing is ok but the page refreshed and then isn't ok. What is mistake? See the code (PS. I tried write "<button><img src="image.bmp" onclick="urediFont('justifyleft');"></button>", the same mistake!)
Here's code:
<script type="text/javascript">
wid="350px";
function stvoriEditor(){
var mjesto=document.getElementById('mjesto');
var prozor=document.createElement('iframe');
prozor.name=prozor.id="uredivac";
mjesto.appendChild(prozor);
uredivac.document.designMode="on";
uredivac.document.open();
uredivac.document.write('<html><head><style type="text/css">body{font-family:libersina,Arial;font-size:15px;}</style></head><body>');
uredivac.document.close();
uredivac.focus();
document.getElementById('uredivac').style.width=wid;
document.getElementById('naredbe').style.width=wid;
}
window.onload=function(){
stvoriEditor();
}
function urediFont(x,y){
uredivac.document.execCommand(x,"",y);
uredivac.focus();
}
function dodajLink(){
var link=prompt('Upisite URL:');
if(link==null){
link='http://www.webdevproject.com';
}
urediFont('CreateLink',link);
}
function spremi(){
var sadrzaj=uredivac.document.body.innerHTML;
sadrzaj=content.replace(/</g,"<").replace(/>/g,">");
document.getElementById('sadrzaj').value=sadrzaj;
}
</script>
<style type="text/css">
#uredivac{
border:1px inset black;
}
#naredbe{
background-color:rgb(199,147,69);
}
.na{
background-color:rgb(199,147,69);
border:0px;
font-family:libersina,arial;
font-size:15px;
}
input[disabled]{
background-color:rgb(105,84,33);
border:0px;
font-family:libersina,arial;
font-size:15px;
}
</style>
<form action="" method="post" onsubmit="spremi(); return true;">
<div id="naredbe">
<input type="button" class="na" style="font-weight:bold;" value="B" onclick="urediFont('bold');">
<input type="button" class="na" style="text-decoration:underline;" value="U" onclick="urediFont('underline');">
<input type="button" class="na" style="font-style:italic;" value="I" onclick="urediFont('italic');">
<input type="button" class="na" value="Dodaj link" onclick="dodajLink();">
<input type="image" src="por_l.bmp" class="na" onclick="urediFont('justifyleft')">
<input type="image" src="por_s.bmp" class="na" onclick="urediFont('justifycenter')">
<input type="image" src="por_d.bmp" class="na" onclick="urediFont('justifyright')">
<input type="image" src="por_o.bmp" class="na" onclick="urediFont('justifyfull')">
<input type="button" class="na" value="1" onclick="urediFont('insertorderedlist')">
<input type="button" class="na" value="t" onclick="urediFont('insertunorderedlist')">
<input type="button" class="na" value="l" onclick="urediFont('outdent')">
<input type="button" class="na" value="d" onclick="urediFont('indent')">
<select id='boja' onchange="urediFont('ForeColor',this[this.selectedIndex].value)">
<option style="color:black;" value="black">-</option>
<option style="color:blue;" value="blue">-</option>
<option style="color:green;" value="green">-</option>
<option style="color:pink;" value="pink">-</option>
</select>
<select id='font' onchange="urediFont('fontname',this[this.selectedIndex].value)">
<option value="Arial">Arial</option>
<option value="Comic Sans MS">Comic Sans MS</option>
<option value="Times New Roman">Times New Roman</option>
</select>
<select id='velicina' onchange="urediFont('fontsize',this[this.selectedIndex].value)">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
<input type="hidden" name="sadrzaj" id="sadrzaj" value="">
</div>
<div id="mjesto"></div>Thanks!
(PS. How to add tables?)
