Mecha versi 2.6.4 sudah dirilis!

View Plain Code

Tabel Konten
  1. Versi JavaScript Mentah 
Plain Code
View Plain Code
$('pre').each(function() {
    // Sisipkan elemen pemicu jendela munculan
    $(this).addClass('viewplain').append('<a href="#" class="plain">View Plain</a>');
});

// Saat pemicu jendela munculan diklik...
$('a.plain', 'pre').click(function() {
    // Tampilkan jendela munculan dengan ukuran lebar 600 dan tinggi 300
    var pl = window.open('', '', 'status=0, resizable=0, width=600, height=300, top=50, left=100'),
        output = $(this).parent().find('code').html();
    // Ketik semua kode yang ada di dalam elemen induk dari elemen pemicu (dalam hal ini adalah tag PRE)
    pl.document.write('<textarea style="width:100%;height:270px;" spellcheck="false">' + output + '</textarea>');
    // Set nilai tag TITLE pada jendela munculan
    pl.document.title = "Plain Code";
    return false;
});

Lihat Demo

Versi JavaScript Mentah 

Lebih praktis. Baca di sini ⇒ JavaScript Popup Copy Code

13 Komentar

Putra

ini cocoknya buat blog yg sengaja gak bisa dicopaskan?? ^_^
tapi kalau semisal code nya banyak enakan digini in, gak panjang postingannya ;)

Taufik Nurrohman

@Alam Perwira Nggak harus untuk blog yang tidak bisa di-copas kok. Saya cuma sering melihat beberapa Syntax Highlighter yang memiliki fasilitas aneh seperti ini:

Sampai Saya tidak sengaja tahu bahwa JavaScript document.write() ternyata bisa dituliskan di dalam jendela munculan. Cek salah satu halaman Tryit Editor di W3Schools http://www.w3schools.com/js/tryit.asp?filename=try_win_focus

Untuk sementara Saya baru bisa membuat fasilitas seperti itu dengan JQuery. Kalau memakai JavaScript mentah Saya masih bingung hehe... @@,

[note]Terkait: syntaxhighlighter - Free syntax highlighter written in Java Script - Google Project Hosting[/note]

Unknown

Saya pernah masuk di blog orang yang mengunakan pasilitas aneh itu bang, udahlah tidak bisa dicopy di CTRL+U juga ndak bisa, sampai enabel javascript juga tetap ndak bisa. lebih parahnya itu blog Tutorial. Pedahal menurut saya pasilitas aneh untuk menempatkan Code itu bisa di buat Jendela POP UP biar kodenya bisa diambil pengunjung yang mau mengunakan tutor tersebut.

Beben Koben

@Suwardi Unggit nama blognya apa ya?
barang kali dia memakai CSS tuh buat menonaktifkan segala yg berbau-bau kopi2 :p

Unknown

@Beben Kobenbisa juga ngasih kode tambahan di tag body, tapi saya ngga ingat kodenya :3

Unknown

@Syndicate OS dan @Beben Koben Salah satu web yang pernah saya kritik ketika saya mencari tugas ini:elektronika-dasar.com . tapi sekarang udah dirubah sama Admin supaya bisa dicopy, kalau yang tutorial saya udah lupa alamatnya ..

Unknown

kalau ini digunakan untuk blockquote bisa tidak ? tolong diberitahu codenya

Taufik Nurrohman

$('blockquote').each(function() {
$(this).addClass('viewplain').append('<a href="#" class="plain">View Plain</a>');
});
$('.plain', 'blockquote').click(function() {
var pl = window.open('', '', 'status=0, resizable=0, width=600, height=300, top=50, left=100'),
output = $(this).parent().find('code').html().replace(/(<br>|<br\/>|<br \/>)/g, "");
pl.document.write('<textarea style="width:100%;height:270px;" spellcheck="false">' + output + '</textarea>');
pl.document.title = "Plain Code";
return false;
});

Demo: http://jsfiddle.net/tovic/557yf/4/

Putra

mas, ijin copas kode css class catatan yah, hehe. Sory terlambar =D

Adi Nugraha Y

makasih ya mas :D , o iya, kok Jquery di blog saya gak jalan ya ? :\ mohon pencerahannya.. makasih :D

Taufik Nurrohman

Mungkin karena JQuery tidak punya kaki. Mungkin JQuery tidak bisa jalan, tapi bisa menggelundung.

Adi Nugraha Y

oh god -_- maksudnya tidak berfungsi -_-

Komentar telah ditutup.