Cevaplar
Hiç cevap bulunamadı.
İlk cevabı siz yazın.
|
|
|
|
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Web Metin Editörü</title>
<script type="text/javascripts" src="http://code.jquery.com/jquery-1.5.1.min.js"></script>
<script type="text/javascripts">
$(document).ready(function(){
$("#editor_ust a").click(function(){
var tiklanan = $(this).attr("id");
var icerik = $("#icerik").val();
if (tiklanan == "b"){
$("#icerik").val(icerik + "<b></b>");
}else if (tiklanan == "i"){
$("#icerik").val(icerik + "<em></em>");
}else if (tiklanan == "u"){
$("#icerik").val(icerik + "<span style='text-decoration: underline'>></span>");
}else if (tiklanan == "s"){
$("#icerik").val(icerik + "<span style='text-decoration: line-throught></span>");
}else if (tiklanan == "sol"){
$("#icerik").val(icerik + "<span style='text-align: left'></span>");
}else if (tiklanan == "orat"){
$("#icerik").val(icerik + "<span style='text-align: center'></span>");
}else if (tiklanan == "sag"){
$("#icerik").val(icerik + "<span style='text-align: right'></span>");
}else if (tiklanan == "link"){
var link2 = prompt("Link adresini girin","http://");
$("#icerik").val(icerik + link2);
}else if (tiklanan == "resim"){
var resim2 = prompt("Resmin adresini girin","http://");
$("#icerik").val(icerik + resim2);
}
});
});
</script>
<style type="text/css">
img {border: none}
#editor {width: 400px; height: 200px; border: 2px solid #ddd}
#editor_ust {background-color: #eee; padding: 7px 5px 5px 5px; border: 1px solid #fff; border-bottom-color: #ddd}
#icerik {border: 2px solid #eee; margin: 5px; width: 375px; height: 120px; font: 12px Arial; color: $656565; padding: 5px}
#smile {padding: 3px}
#smile img {vertical-align: text-top}
</style>
</head>
<body>
<div id="editor">
<div id="editor_ust">
<a href="#" id="b"><img src="images/01.png" alt="" /></a>
<a href="#" id="i"><img src="images/02.png" alt="" /></a>
<a href="#" id="u"><img src="images/03.png" alt="" /></a>
<a href="#" id="s"><img src="images/04.png" alt="" /></a>
<a href="#" id="sol"><img src="images/05.png" alt="" /></a>
<a href="#" id="orta"><img src="images/06.png" alt="" /></a>
<a href="#" id="sag"><img src="images/07.png" alt="" /></a>
<a href="#" id="link" src="images/09.png" alt="" /></a>
<a href="#" id="resim"><img src="images/10.png" alt="" /></a>
</div>
<textarea rows="0" cols="0" id="icerik"></textarea>
<div style="float: right; padding-right: 5px"><input type="image" src="images/gonder.png"/></div>
</div>
</body>
</html>
 
|
 |
 |
 |
 |