Skip URL Redirection (Adf.ly, urlcash.net, lnk.co dlsb)

Trik skip otomatis halaman URL Shortener (Adf.ly, urlcash.net, lnk.co dlsb) menggunakan UserScript Redirection Helper

Iklan resek pada link referensi ataupun url download yang disediakan oleh webmaster web/blog kadang membuat aktifitas browsing menjadi kurang nyaman, tidak menyenangkan & menyita waktu (tidak efisien). Tautan external link yang diberikan biasanya menyembunyikan alamat/url asli web yang ingin dituju dan memaksa visitor melihat halaman iklan tertentu untuk beberapa saat (bukannya langsung diarahkan pada url asli).

Sempat heran & bertanya-tanya juga saya!!! Kenapa demi beberapa sen Dollar (kurang lebih sekitar $0,004 atau Rp.38 per tayang iklan), webmaster web/blog rela mengorbankan kenyamanan berkunjung visitor menjadi kurang menyenangkan.

Mungkin cara ini wajar/bisa dilakukan dengan tujuan hanya sebatas untuk memperpendek karakter url agar mudah diingat oleh visitor/pengunjung web. Namun saya yakin, mereka punya alasan & pertimbangan sendiri-sendiri mengapa membuat tautan link referensi memakai cara seperti ini.

Biasanya external link web direferensikan sejenis ini adalah web download gratis (file sharing), screenshot gambar atau kadang url referral. Plugin browser Ad Block malah sering gagal skip/melewatkan url redirect semacam ini. Jika anda merasa terganggu & ingin skip url redirection, jangan nyerah dulu. Setiap ada kemauan pasti ada jalan, dibutuhkan trik khusus dengan install script tambahan pada browser (pada artikel ini akan install script tambahan untuk browser Mozilla Firefox & Google Chrome).

Contoh beberapa situs web URL Redirection:

→ http://adf.ly
→ http://urlcash.net
→ http://lnk.co
→ http://adfoc.us
→ dlsb

Contoh Iklan URL Redirection

Sekarang halaman iklan dari situs-situs di atas dapat diatasi dengan menggunakan UserScript Redirection Helper. Script ini terlebih dahulu harus diinstall pada browser Firefox atau Chrome dan setelah terinstall, script secara otomatis akan skip (mengabaikan) iklan/ads dan redirect langsung ke halaman tujuan (landing page).

Tertulis pada situs resminya, RedirectionHelper dapat:

1. Skip the redirection of linkbucks, adf.ly, lnk.co, etc.
2. Remove annoying ads or mask, like imageporter, imagevenue, turboimagehost and so on.
3. Turn to actual hyperlink for alabout.com and alafs.com.
4. Suited for FireFox (with both of GreaseMonkey and Scriptish) and Google Chrome.

Instalasi Script RedirectionHelper

Pengguna Firefox Browser (Firefox Users)

Install extention Greasemonkey, kunjungi web → klik tombol + Add to Firefox → restart Firefox untuk apply extention. Kemudian install RedirectionHelper dengan klik pada link Install.

Download RedirectionHelper

Install RedirectionHelper

Greasemonkey - Install RedirectionHelper

Greasemonkey - Install Sukses

Pengguna Google Chrome Browser (Google Chrome Users)

Pengguna Google Chrome, tanpa install Greasemonkey bisa langsung klik pada tombol Install pada halaman download & install RedirectionHelper. "Extentions, apps, and themes can harm your computer. Are you sure you want to continue?" Klik tombol Continue. Pada popup dialog Confirm New Extentions Add "RedirectionHelper"? klik tombol Add

Install RedirectionHelper

Google Chrome - Install RedirectionHelper

Google Chrome - Confirm Extention

Selesai.

Google Chrome - Ekstensi Terinstall

Setelah ekstensi ini berhasil terinstall, user tidak perlu lagi klik manual pada link Skip Ad atau link/tombol sejenis lainnya. RedirectionHelper akan mengabaikan/klik link Skip Ad ini secara otomatis. Dengan kata lain ekstensi ini tidak sepenuhnya menghilangkan halaman iklan (tentu saja, karena url/alamat landing page yang dituju tergantung pada url web redirect/pengalihan dari web link shortener).

Selengkapnya

Encript & Decrypt File JavaScript

Beberapa web developer sengaja compress file js (javascript), dengan alasan paling umum menghindari orang lain mencuri code yang mereka tulis. Untuk encrypt file js, online tool yang biasa digunakan web developer adalah packer buatan Dean Edwards. Tinggal paste konten file js pada text area Paste:, check checkbox Base62 encode kemudian klik tombol Pack. Hasil encrypt dapat anda lihat pada text area Copy:

Contoh hasil encrypt javascript:

eval(function(p,a,c,k,e,r){e=function(c){return c.toString(a)};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('<1>2 3(){6.0=2(0,4){7.8(0+\' \'+4)}}5=9 3;5.0(\'a\',\'b\');</1>',12,12,'foo|script|function|HelloWorld|bar|H|this|document|write|new|Hello|World'.split('|'),0,{}))

Namun bagaimana jika anda ingin decode (decrypt) file javascript? Sayangnya packer tool Dean Edwards hanya bisa decode hasil encode text area Paste: (text area Copy: sengaja diberi batasan read-only). Sebenarnya saya maju mundur mau posting artikel ini (takut dikomplain ama Dean Edwards, ha..ha...), namun sekedar buat sharing info untuk anda yang ingin decrypt (decode) file .js hasil encript packer Dean Edwards (biasanya dimulai dengan code eval(function(p,a,c,k,e,r)..., berikut triknya.

1. Kunjungi situs unpacker js di sini.
2. paste code js pada text area Paste Packed Code Here
3. Klik tombol Unpack
4. Copy hasil encrypt (decode) file javascript pada text area Un-Packed Code

Contoh hasil decrypt code encrypt javascript di atas:

< script >
function HelloWorld() {
this.foo = function (foo, bar) {
document.write(foo + ' ' + bar)
}
}
H = new HelloWorld;
H.foo('Hello', 'World'); < /script>

Selesai

Selengkapnya

PHP To JavaScript Converter

Tidak sengaja saya baru saja menemukan script unik di google code, script PHP yang dapat convert File PHP ke JavaScript. Penasaran! Langsung saja ke TKP. Berikut cara sederhana convert file PHP ke JavaScript.

Pertama, persyaratan untuk dapat menjalankan script PHP to JavaScript Converter ini adalah Webserver (Setidaknya Apache Webserver harus terinstall di server). Jika anda punya account hosting, anda bisa langsung melanjutkan tutorial ini. Namun jika tidak ada, tidak masalah. Script ini bisa juga dijalankan oleh Apache yang terinstall pada sistem operasi Windows (menggunakan WAMP Server).

Kedua, code simple PHP to JavaScript Converter. Copy code PHP di bawah ini kemudian simpan dengan nama terserah (bebas). Misal, php2js.php:

<?php
error_reporting(E_ALL);
class PHP2js {
/** @var array holds tokens of the php file being converted */
private $_tokens;
/** @var int number of tokens */
private $count;
/** @var int the current token */
private $current = 0;
/** @var javascript gets collected here */
private $js;

/** @var array these token keys will be converted to their values */
private $_convert = array (
'T_IS_EQUAL'=>'==',
'T_IS_GREATER_OR_EQUAL'=>'>=',
'T_IS_SMALLER_OR_EQUAL'=>'<=',
'T_IS_IDENTICAL'=>'===',
'T_IS_NOT_EQUAL'=>'!=',
'T_IS_NOT_IDENTICAL'=>'!==',
'T_IS_SMALLER_OR_EQUA'=>'<=',
'T_BOOLEAN_AND'=>'&&',
'T_BOOLEAN_OR'=>'||',
'T_CONCAT_EQUAL'=>'+= ',
'T_DIV_EQUAL'=>'/=',
'T_DOUBLE_COLON'=>'.',
'T_INC'=>'++',
'T_MINUS_EQUAL'=>'-=',
'T_MOD_EQUAL'=>'%=',
'T_MUL_EQUAL'=>'*=',
'T_OBJECT_OPERATOR'=>'.',
'T_OR_EQUAL'=>'|=',
'T_PLUS_EQUAL'=>'+=',
'T_SL'=>'<<',
'T_SL_EQUAL'=>'<<=',
'T_SR'=>'>>',
'T_SR_EQUAL'=>'>>=',
'T_START_HEREDOC'=>'<<<',
'T_XOR_EQUAL'=>'^=',
'T_NEW'=>'new',
'T_ELSE'=>'else',
'.'=>'+',
'T_IF'=>'if',
'T_RETURN'=>'return',
'T_AS'=>'in',
'T_WHILE'=>'while',
'T_LOGICAL_AND' => 'AND',
'T_LOGICAL_OR' => 'OR',
'T_LOGICAL_XOR' => 'XOR',
'T_EVAL' => 'eval',
'T_ELSEIF' => 'else if',
'T_BREAK' => 'break',
'T_DOUBLE_ARROW' => ':',
);

/** @var array these tokens stays the same */
private $_keep = array(
'=', ',', '}', '{', ';', '(', ')', '*', '/', '+', '-', '>', '<', '[', ']',
);

/** @var array these tokens keeps their value */
private $_keepValue = array (
'T_CONSTANT_ENCAPSED_STRING', 'T_STRING', 'T_COMMENT', 'T_ML_COMMENT', 'T_DOC_COMMENT', 'T_LNUMBER',
'T_WHITESPACE',
);

/**
* constructor, runs the show
*
* @param string $file path (relative or absolute) to the php file that is converted to js
*/
public function __construct ($file) {
$this->file = $file;
$this->_tokens = $this->getTokens($file);
$this->count = count($this->_tokens)-1;
$this->compileJs();

}

/**
* gets tokens from file. Remove the meta PHP2js stuff.
*
* @param string $file path (relative or absolute) to the php file that is converted to js
* @return array
*/
private function getTokens($file) {
$src = file_get_contents($this->file);
$src = preg_replace ("/\n([\t ]*)require.*PHP2js\.php.*\'.*;/Uis", "", $src);
$src = preg_replace ("/\n([\t ]*)new.*PHP2js.*;/Uis", "", $src);
$this->src = $src;
return token_get_all($src);
}

/**
* loops through tokens and convert to js
*
*/
private function compileJs() {
foreach ($this->_tokens as $_) {
$this->next ($name, $value);
$this->parseToken($name, $value, $this->js);
}
}

/**
* output the js and die
*/
private function renderJs () {
echo "<script>$this->js</script>";
die();
}

/**
* changed referenced args to name and value of next token
*
* @param string $name
* @param string $value
* @param unknown_type $i, the amount of nexts to skip
*/
private function next(& $name, & $value, $i=1) {
for ($j=0; $j<$i; $j++) {
$this->current++;
if ($this->current > $this->count) $this->renderJs();
$_token = $this->_tokens[$this->current];
$this->getToken ($name, $value, $_token);
}
}

/**
* find and return first name matching argument
*
* @param mixed $_tokenNames
* @return string
*/
private function findFirst ($_needles) {
$name = $value = '';
for ($i=$this->current+1; $i<$this->count; $i++) {
$this->getToken($name, $value, $this->_tokens[$i]);
if (in_array($name, (array)$_needles)) {
return $name;
}
}
}

/**
* return javascript until match, match not included
*
* @param array $_needles
* @return string
*/
private function parseUntil ($_needles, $_schema=array(), $includeMatch = false) {
$name = $value = $js = $tmp = '';
while (true) {
$this->next ($name, $value);
$this->parseToken($name, $value, $tmp, $_schema);
if (in_array($name, (array)$_needles)) {
if ($includeMatch === true) {
return $tmp;
} else {
return $js;
}
}
$js = $tmp;
}
}

/**
* tries to find the token in $this->_convert, $this->_keep and $this->_keepValue
* if it fails it tries to find a method named as the token. If fails here also it throws away the token.
*
* @param string $name
* @param string $value
* @param string $js store js here by reference
*/
private function parseToken ($name, $value, & $js, $_schema=array()) {
//custom changes
if (in_array($name, array_keys ((array)$_schema))) {
$js .= $_schema[$name];
//change name to other value
} else if (in_array($name, array_keys ($this->_convert))) {
$js .= (!empty($this->_convert[$name])) ? $this->_convert[$name]: $name;
//keep key
} elseif (in_array($name, $this->_keep)) {
$js .= $name;
//keep value
} elseif (in_array($name, $this->_keepValue)) {
$js .= $value;
//call method
} else {
if (method_exists($this, $name)) {
$js .= $this->$name($value);
}
}
//ignore
}

/**
* converters
*
* These guys are equivalents to tokens.
*/

/**
* class definition
*
* @param sting $value
* @return string
*/
private function T_CLASS($value) {
$this->next ($name, $value, 2);
return "function $value() ";
}

/**
* define function
*
* @param string $value
* @return string
*/
private function T_FUNCTION($value) {
$this->next ($name, $value, 2);
return "this.$value = function";
}

/**
* echo is replaced with document.write
*
* @param string $value
* @return string
*/
private function T_ECHO($value) {
return 'document.write('.$this->parseUntil(';').');';
}

/**
* array. Supports both single and associative
*
* @param string $value
* @return string
*/
private function T_ARRAY($value) {
$_convert = array('('=>'{',     ')'=>'}',);
$js = $this->parseUntil(array(';'), $_convert, true);
if (strpos($js, ':') === false) {
$this->tmp = -1;
$js = preg_replace_callback ('/([{, \t\n])(\'.*\')(|.*:(.*))([,} \t\n])/Uis', array($this, 'cb_T_ARRAY'), $js);
}
return $js;
}

private function cb_T_ARRAY($_matches) {
$this->tmp++;
if (strpos($_matches[0], ':') === false) {
return ($_matches[1].$this->tmp.':'.$_matches[2].$_matches[3].$_matches[4].$_matches[5]);
} else {
return $_matches[0];
}
}
/**
* foreach. Gets converted to for (var blah in blih). Supports as $key=>$value
*
* @param string $value
* @return string
*/
private function T_FOREACH($value) {
$_vars = array();
while (true) {
$this->next ($name, $value);
if ($name == 'T_VARIABLE') $_vars[] = $this->cVar($value);
$this->parseToken($name, $value, $js);
if ($name == '{') {
if (count($_vars) == 2) {
$array = $_vars[0];
$val = $_vars[1];
$this->js .=
"for (var {$val}Val in $array) {".
"\n                        $val = $array"."[{$val}Val];";
}
if (count($_vars) == 3) {
$array = $_vars[0];
$key = $_vars[1];
$val = $_vars[2];
$this->js .=
"for (var $key in $array) {".
"\n                        $val = $array"."[$key];";
}
return '';
}
$jsTmp = $js;
}
}

/**
* declare a public class var
*
* @param string $value
* @return string
*/
private function T_PUBLIC ($value) {
$type = $this->findFirst(array('T_VARIABLE', 'T_FUNCTION'));
if ($type == 'T_FUNCTION') return '';
$js = '';
while (true) {
$this->next ($name, $value);
$this->parseToken($name, $value, $js);
if ($name == ';') {
$js = str_replace(array(' '), '', $js);
return 'this.'.$js;
} else if ($name == '=') {
$js = str_replace(array(' ','='), '', $js);
return 'this.'.$js.' =';
}
}
}

/**
* variable. Remove the $
*
* @param string $value
* @return string
*/
private function T_VARIABLE($value) {
return str_replace('$', '', $value);
}

/* helpers */

private function getToken(& $name, & $value, $_token) {
if (is_array($_token)) {
$name = trim(token_name($_token[0]));
$value = $_token[1];
} else {
$name = trim($_token);
$value = '';
}
}

private function cVar($var) {
return str_replace('$', '', $var);
}

/** debugging stuff. Ugly and deprecated. */

/** deprecated and sucks */
private $_openTags = array(
'T_OPEN_TAG', 'T_CLASS', 'T_PUBLIC', 'T_FOREACH', 'T_ARRAY', '{', 'T_VARIABLE', '('
);

/** deprecated and sucks */

/** deprecated and sucks */
private $indent = 0;
/** deprecated and sucks */
private $debug;


private $_closeTags = array(
'}', 'T_CLOSE_TAG', ';', ')',
);

public function __destruct() {
/**
$js = htmlentities ($this->js);
echo ("<pre>$js</pre>");
$this->write();
echo $this->debug;
//*/
}


private function write() {
$_tokens = token_get_all($this->src);
foreach ($_tokens as $key=>$_token) {
if (is_array($_token)) {
$name = trim(token_name($_token[0]));
$value = $_token[1];
} else {
$name = trim($_token);
$value = '';
}
$this->printToken($name, $value, $_token);
}
}

private function printToken ($name, $value, $_token) {
$value = htmlentities($value);

if (in_array($name, $this->_closeTags)) $this->indent--;
$indent = str_repeat('.&nbsp;&nbsp;&nbsp;&nbsp;', $this->indent);
if (in_array($name, $this->_openTags)) $this->indent++;
if (!empty($value))
$this->debug .= "
<br />$indent
<b>$name&nbsp;&nbsp;=&nbsp;&nbsp;'$value'</b>

";
else
$this->debug .= "
<br />$indent
<b>$name</b>

";
}
}
?>

Upload file php2js.php ke server. Kemudian buat file Baru dengan nama bebas, convert.php misalnya. Isikan convert.php dengan code PHP yang ingin anda convert (di bawah "/* Convert Code Start Here */"), kemudian upload ke web server. Misalnya seperti kode di bawah ini:

<?
require_once 'php2js.php';
new php2js(__FILE__);
/**
* My super cool php class that will be converted to js!!!
*/
/* Convert Code Start Here */
class HelloWorld {
/**
* So here goes a function that echos
*
* @param string $foo
* @param string $bar
*/
function foo($foo, $bar) {
echo $foo . ' ' . $bar;
}
}
$H = new HelloWorld;
$H->foo('Hello', 'World');
?>

Buka file convert.php pada web browser, hasil yang keluar akan tampak seperti pada gambar Screenshot 1. Untuk melihat code JavaScript hasil convert, jika menggunakan browser Mozilla Firefox klik kanan pada halaman kosong web browser kemudian klik View Page Source (Screenshot 2), atau tekan tombol shortcut Ctrl + U. Pada jendela baru yang terbuka, anda akan melihat source code JavaScript hasil convert (Screenshot 3).

<script>
/**
* My super cool php class that will be converted to js!!!
*/
/* Convert Code Start Here */
function HelloWorld()  {
/**
* So here goes a function that echos
*
* @param string $foo
* @param string $bar
*/
this.foo = function(foo, bar) {
document.write( foo + ' ' + bar);
}
}
H = new HelloWorld;
H.foo('Hello', 'World');
</script>

Screenshot 1

Screenshot 2

Screenshot 3

Selesai. Semoga bermanfaat.
:)

Selengkapnya

Menonaktifkan (disable) Klik Kanan Mouse

Jika ingin menonaktifkan (disable) klik kanan mouse web/blog yang anda miliki, dengan tujuan untuk mencegah seseorang mengambil gambar atau melihat kode html/javascript, maka anda dapat menggunakan simpel JavaSript di bawah ini.

Code JavaScript disable klik kanan mouse.

[jscript]
<script language="JavaScript">
var message="Hak cipta milik \"Nama Anda\". Dilarang menyalin sebagian atau seluruh isi konten";
function clickIE4(){
if (event.button==2){
alert(message);
return false;
}
}
function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
alert(message);
return false;
}
}
}
if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}
document.oncontextmenu=new Function("alert(message);return false")
</script>
[/jscript]

Pesan yang akan muncul jika ada orang yang klik kanan mouse pada web/blog anda, pada code di atas terletak pada:

[jscript collapse="false"]
var message="Tulis pesan anda di sini";
[/jscript]

Jika anda ingin menambahkan karakter tanda petik (quotes), jangan langsung memasukkan pada kode script di atas. Contoh jika ingin menulis pesan peringatan yang muncul ketika ada pengunjung yang klik kanan mouse, seperti misal "Hak cipta milik 'ama Anda'. Dilarang menyalin sebagian atau seluruh isi konten", maka code yang harus anda tuliskan adalah:

[jscript collapse="false"]
var message="Hak cipta milik \"Nama Anda\". Dilarang menyalin sebagian atau seluruh isi konten";
[/jscript]

Apabila tanda petik langsung ditambahkan begitu saja, maka script tidak akan berfungsi.

Untuk melihat contoh, silahkan buka halaman ini (terbuka di tab baru).

Have fun...
:D

Selengkapnya

Image Slider Web/Blog

Trik Membuat Slider Image (Gambar) Pada Web/blog

---

Tentu saja web/blog lebih terlihat menarik dengan menambahkan animasi, seperti contoh yang akan dibahas di sini adalah membuat dan menambahkan slide image (gambar) pada website / blog. Seperti apa contoh slider image, langsung lihat saja contohnya pada halaman ini.

Slider Image yang akan dibuat akan mempunyai beberapa fitur antara lain:

1. Slideshow dengan gambar disertai deskripsi singkatnya
2. Tombol "Play, Pause, Next, dan Previous".
3. Kecepatan / delay waktu slideshow yang dapat disesuaikan
4. Script yang dapat disesuaikan dengan ukuran gambar yang dipakai

OK langsung saja, begini tahapan pembuatannya. Sebelumnya download dahulu bahannya di halaman ini.

Pertama buat dulu css nya seperti di bawah ini:

[css]
<style type="text/css">
#slider {
width: 300px;
height: 186px;
position: relative;
overflow: hidden;
}

#slider a:link, #slider a:active {
color: #FF0;
text-decoration: none;
}

#slider a:hover {
color: #F00;
}

#mask-gallery {
overflow: hidden;
}

#gallery {
list-style: none;
margin: 0;
padding: 0;
z-index: 0;
width: 900px;
overflow: hidden;
}

#gallery li {
float: left;
}

#mask-excerpt {
position: absolute;
top: 0;
left: 0;
z-index: 500px;
width: 100px;
overflow: hidden;
}

#excerpt {
filter: alpha(opacity=60);
-moz-opacity: 0.6;
-khtml-opacity: 0.6;
opacity: 0.6;
list-style: none;
margin: 0;
padding: 0;
z-index: 10;
position: absolute;
top: 0;
left: 0;
width: 100px;
background-color: #000;
overflow: hidden;
font-family: arial;
font-size: 10px;
color: #fff;
}

#excerpt li {
padding: 5px;
}

</style>
[/css]

Ganti ukuran gambar sesuai dengan gambar anda. Selanjutnya Copy dan pastekan kode script di bawah di atas atau di bawah kode css yang baru anda buat.

[jscript]
<script>
$(document).ready(function() {

var speed = 5000;


$('#mask-gallery, #gallery li').width($('#slider').width());
$('#gallery').width($('#slider').width() * $('#gallery li').length);
$('#mask-gallery, #gallery li, #mask-excerpt, #excerpt li').height($('#slider').height());

var run = setInterval('newsscoller(0)', speed);

$('#gallery li:first, #excerpt li:first').addClass('selected');

$('#btn-pause').click(function () {
clearInterval(run);
return false;
});

$('#btn-play').click(function () {
run = setInterval('newsscoller(0)', speed);

return false;
});

$('#btn-next').click(function () {
newsscoller(0);
return false;
});

$('#btn-prev').click(function () {
newsscoller(1);
return false;
});

$('#slider').hover(
function() {
clearInterval(run);
},
function() {
run = setInterval('newsscoller(0)', speed);
}
);
});

function newsscoller(prev) {
var current_image = $('#gallery li.selected').length ? $('#gallery li.selected') : $('#gallery li:first');
var current_excerpt = $('#excerpt li.selected').length ? $('#excerpt li.selected') : $('#excerpt li:first');

if (prev) {

var next_image = (current_image.prev().length) ? current_image.prev() : $('#gallery li:last');

var next_excerpt = (current_excerpt.prev().length) ? current_excerpt.prev() : $('#excerpt li:last');

} else {
var next_image = (current_image.next().length) ? current_image.next() : $('#gallery li:first');
var next_excerpt = (current_excerpt.next().length) ? current_excerpt.next() : $('#excerpt li:first');
}

$('#excerpt li, #gallery li').removeClass('selected');
next_image.addClass('selected');
next_excerpt.addClass('selected');

$('#mask-gallery').scrollTo(next_image, 800);
$('#mask-excerpt').scrollTo(next_excerpt, 800);

}

</script>
[/jscript]

Var Speed= 5000, yang berarti mengatur delay untuk setiap pergantian gambar (semakin kecil nilainya maka semakin cepat delay pergantian gambarnya). "$('#mask-gallery').scrollTo(next_image, 800)" dan "$('#mask-excerpt').scrollTo(next_excerpt, 800)", nilai 800 mengatur kecepatan perpindahan slide (semakin kecil nilainya maka akan semakin cepat).

Selanjutnya buat konten yang mana harus diisikan antara kode <body> sampai dengan </body>. Contohnya seperti di bawah:

[html]
<div id="slider">

<div id="mask-gallery">
<ul id="gallery">
<li><img src="images/gambar1.jpg" width="300" height="186" alt=""/></li>
<li><img src="images/gambar2.jpg" width="300" height="186" alt=""/></li>
<li><img src="images/gambar3.jpg" width="300" height="186" alt=""/></li>
</ul>
</div>

<div id="mask-excerpt">
<ul id="excerpt">
<li>Isikan diskripsi singkat untuk gambar <a href="#">slideshow yang pertama</a></li>
<li>Selanjutnya bagian ini untuk deskripsi singkat <a href="#">gambar yang kedua</a></li>
<li>Dan ini merupakan deskripsi singkat untuk <a href="#">gambar yang ketiga</a></li>
</ul>
</div>
</div>

<div id="buttons">
<a href="#" id="btn-prev">prev</a>
<a href="#" id="btn-pause">pause</a>
<a href="#" id="btn-play">play</a>
<a href="#" id="btn-next">next</a>
</div>
[/html]

Nah sekarang link kan script file "jquery.scrollTo" dan "jquery-1.3.1.min" dalam folder "js" yang baru saja anda download diantara kode <head> sampai </head>. Cara link nya contohnya seperti di bawah ini:

[jscript collapse="false"]
<script type="text/javascript" src="js/jquery-1.3.1.min.js"></script>
<script type="text/javascript" src="js/jquery.scrollTo.js"></script>
[/jscript]

Untuk pengguna blogger "src=..." gantikan dengan alamat url dimana script file tersebut anda upload. Jika anda mempunyai account gmail, upload file anda di google sites. Lihat hasilnya di sini.

Selengkapnya

Blinking Text Effect

Banyak cara dapat dilakukan untuk menarik perhatian pembaca pada tulisan blog mulai dari mengubah ukuran huruf text, memberi atribut tebal pada text, text miring, marque text, ataupun memberi warna text yang lebih mencolok dari warna text lainnya. Ada juga yang yang memberikan efek tertentu pada blog seperti misalnya membuat efek blink (berkedip) seperti tulisan yang hilang lalu muncul lagi, hilang lagi, muncul lagi, dan seterusnya seperti ini. Kok bisa ya! Caranya simpel.

Untuk pengguna mozilla firefox cukup dengan menuliskan sedikit kode, text diikuti kode "<blink>" dan text diakhiri dengan kode "</blink>".

Contoh: efek blinking pada tulisan 'Saya pakai mozilla firefox', maka code yang disisipkan adalah ==> "<blink>Saya pakai mozilla firefox</blink>". Hasilnya akan seperti ini:

Saya pakai mozilla firefox.

Cukup simpel kan. Bagi pengguna internet explorer 7 ke bawah, sedikit tweak code diperlukan. Sisipkan code css & JavaScript berikut di antara tag "<head>";

<style type='text/css'>
<!--* blink{ visibility: expression((Math.floor(new Date().getTime()/1000)%2)?"visible":"hidden");}-->
</style>
<script type='text/javascript'>
<!--setInterval("document.recalc()",1);-->
</script>

Semoga bermanfaat...
:D

Selengkapnya

Walking Text Title Tab Blogspot

Trik Membuat Walking Text Title Tab Blogspot

Tips kali ini tentang cara membuat text title blog yang berjalan pada tab interface browser. Trik ini tidak banyak memberikan kontribusi yang berarti pada kualitas blog, hanya sebatas untuk mempercantik blog. Bagaimana cara membuatnya, cukup sederhana. Ikuti step di bawah;

1. Login ke blogspot.
2. Navigasikan ke 'LayOut' (tata letak) → pindah ke tab 'Edit HTML'
3. Copy dan pastekan kode di bawah tepat di atas tag '<'head>'

<script type='text/javascript'>
//<![CDATA[
msg = "Tulis Text-1";
msg = " .:Tulis Text-2:. " + msg;pos = 0;
function scrollMSG() {
document.title = msg.substring(pos, msg.length) + msg.substring(0, pos); pos++;
if (pos > msg.length) pos = 0
window.setTimeout("scrollMSG()",200);
}
scrollMSG();
//]]>
</script>

Ganti 'Tulis Text-1' dan 'Tulis Text-2' dengan text anda. Klik 'Save Templates' (Simpan template).

→ window.setTimeout("scrollMSG()",200); » value '200', semakin kecil nilainya semakin cepat transisi text.

Untuk blog/web selain blogspot, tinggal copy dan pastekan code javascript di atas pada area mana saja (head atau body). Hasilnya dapat dilihat pada title tab artikel ini.

Done...

Have fun...
:D

Selengkapnya