sjcom bojonegoro
 



1. Cara membuatnya : Login blogger
2. Rancangan, Edit Html, Cari kode ]]></b:skin>
3. Dan Simpan kode berikut diatasnya :

.imagewarp, .people{
margin-right:45px;
}

4. Simpan kode berikut diatas kode </head> :

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://kangdadang.googlecode.com/files/imagewarp.js">
/***********************************************
* jQuery imageWarp script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/

</script>

<script type="text/javascript">

jQuery(document).ready(function($){
$('img.people').imageWarp({warpfactor:2}) //apply warp effect to images with CSS class "imagewarp"
$('img.imagewarp').imageWarp() //apply warp effect to images with CSS class "imagewarp"
})

</script>


5. Simpan template
6. Cara pemanggilannya pada html :

Non hyperlinked images, warp factor=2.5, duration=1 second:
<p align="left">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpDmPCBIvygXwBUnMPmMeZNKVK-HU-ufoaNqeqkmuywRbuIMmprkvPczCoravKubAzgI_pyq8cndkZHri1GP_LcgubO2M7msJx6BgooQTBCDzq5iDSQCE7KQmKMi8qFmRK70rFPYjBaLU/s1600/PE02054A.gif" width="74" height="100" class="people" />
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi131fBuGWV1TJUJuSk3qp_DMIfGIBUC6qa2ymkJi9oWggCpZUgCXa00fgR2IezCdC7eMvL5G-z9u283-wLGs2p0dhnPdZoqFxorMOvoe5oN9CUP0GEBdQomcpNopbVjqeDGGYXQB89mPw/s1600/PE01805A.gif" width="100" height="94" class="people" />
</p>


Non hyperlinked images (except last one), warp
factor=1.5, duration=1 second:
<p align="left">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIodJWEcjjCr1Pco9TX-arfElnLN9ggCkeonMDPSb2hVfov48l0OPIKewgrDk4_aVlRnUa2qcUQKfRzJBbNBBR82s7cC-sd_LDVw5g6460Ttsndp3Vnj0546mGcANTK7oG2E4nJwGRS2M/s1600/pool.jpg" width="250" height="180" class="imagewarp" />
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhi7yaxohqaOa9JzchTHPAop24xDc7y18p8ldKQjSMp-DCm6s86iG8SeXDTUvYTmNodOKOETsnfdcWhjaE5GegUF2V2vGf5q1fgOu9kjMbrUohcmg7mcyiSmt4JvLUuwezIo2SPzbs_N-Y/s1600/cave.jpg" width="250" height="180" class="imagewarp" />
</p>

7. Selesai

Selamat Mencoba...

Posting Komentar

 
Top