Skip to main content

Tirai Ajaib di blog dengan efek Jquery

View Demo

Bagaimana cara memasangnya?saya juga saat pertama kali mencoba,kesulitan untuk menggunakanya.tapi setelah dicoba berkali2,akhirnya bisa juga…^^ huft…






okeh,langsung saja saya ajarkan caranya…,
tapi ada baiknya sebelum anda mencoba script ini,kamu
backup dahulu template anda..

1.letakan Script di bawah ini,tepat dibawah kode


2.letakan juga script dibawah ini tepat diatas kode


3.lalu,letakan kode dibawah ini tepat di atas kode


note:leftcurtain dan right curtain adalah alamat gambar yang akan dijadikan tirai pada blog kamu.ganti gambar tirai,dengan kreasi mu,atau copy paste gambar yg sudah saya sediakan..

 
nah,sekarang masukan CSS ini,di atas kode

*{
margin:0;
padding:0;
}
body {
text-align: center;
background: #4f3722 url('images/darkcurtain.jpg') repeat-x;
}
img{
border: none;
}
.leftcurtain{
width: 50%;
height: 495px;
top: 0px;
left: 0px;
position: absolute;
z-index: 2;
}
.rightcurtain{
width: 51%;
height: 495px;
right: 0px;
top: 0px;
position: absolute;
z-index: 3;
}
.rightcurtain img, .leftcurtain img{
width: 100%;
height: 100%;
}
.logo{
margin: 0px auto;
margin-top: 150px;
}
.rope{
position: absolute;
top: -40px;
left: 70%;
z-index: 4;
}

saya membuat dua div kelas untuk dua tirai (. Leftcurtain dan. Rightcurtain) yang dikunci untuk ditunjuk sisi mereka. Ini dilakukan di CSS dengan menggunakan atas, kiri, dan posisi atribut.
Anda akan melihat bahwa kita ditentukan untuk masing-masing lebar tirai, 50% dan 51%. Lebar yang berbeda-beda adalah untuk mengkompensasi beberapa tepi berombak ketika tirai tertutup yang dapat menyebabkan unsur-unsur di bawahnya untuk puncak melalui. Untuk mengatasi hal ini kita membuat tirai kanan sedikit tumpang tindih yang kiri, dengan menggunakan z-indeks. Z-index ini nilai-nilai juga memastikan bahwa tirai tetap di atas segala sesuatu yang seharusnya di balik tirai.
Gambar tirai yang sebenarnya ditetapkan menjadi 100% lebar / tinggi sehingga divs tirai saat ini menyusut divs lebar gambar menjadi berkumpul, seperti mereka dalam kehidupan nyata.
The. Logo berisi apa yang saya ingin bersembunyi di balik tirai, Anda dapat menggantinya dengan apapun yang Anda inginkan.
Akhirnya. Tali hanya tempat tali grafik di atas segalanya dan menyembunyikan sebagian gambar dari layar sehingga kami dapat menyelesaikan "menarik tali" efek kemudian.
langkah terakhir,anda masukan script dibawah ini, di Bawah kode




SELAMAT MENCOBA!!!
 
Sumber :: Blog Johanes
Labels:

Comments

Post a Comment

Popular posts from this blog

Angry Birds v2.1.0 GAME-CRD

Angry.Birds.v2.1.0.GAME-CRD Release name: Angry.Birds.v2.1.0.GAME-CRD Size: 42.8 MB Language : ENG NFO: Here Release Description: The survival of the Angry Birds is at stake. Dish out revenge on the green pigs who stole the Birds’ eggs. Use the unique powers of the Angry Birds to lay waste to the pigs’ confounding constructions. Angry Birds features challenging, physics-based demolition gameplay with hours and hours of replay value. Each of the 240+ levels requires logic, skill, and brute force to crush the enemy. Screenshot Total 42.8 MB Password=ganool.com Download From Tinypaste Related Posts: Angry Birds v1.6.2 cracked READ NFO-THETA Angry Birds Rio v1.4.2 Cracked GAME-ErES Angry Birds Rio v1.2.2 cracked READ NFO-THETA Angry Birds Space v1.0.0 GAME-CRD Angry Birds Seasons v2.3.0 Cracked GAME-ErES .:: Advertisements ::.
Post a Comment
Readmore

Uverworld

UVERworld adalah J-Rock band di Gr8! Catatan di bawah label Sony. Suara umum UVERworld adalah campuran rock dan pop dengan sesekali selingan rap dilemparkan oleh Takuya .Nama mereka adalah nama mereka yang diciptakan sendiri (dengan menggabungkan 'über' dan 'atas') dan kepada mereka berarti 'Pindah silang dunia mereka sendiri'.
Post a Comment
Readmore

Membuat Tampilan Komentar dan Jawaban Beda dengan CSS3

Untuk Template Lama (Template Tata Letak/Layout Templates) dan New Blogger Template). Salah satu cara memberikan "servis terbaik" kepada pembaca atau pengunjung blog adalah dengan memberikan ciri khusus pada jawaban komentar yang dibuat autor. Dengan cara ini maka komentar pengunjung dan jawaban yang berupa komentar dari author akan terlihat dengan sangat jelas. Beberapa cara bisa dilakukan misalnya dengan membuat bentuk teks berbeda atau dengan cara memberi background pada box yang berisikan komentar pengunjung atau sebaliknya pada komentar autor (jawaban komentar). Untuk membuat bentuk kolom komentar yang sangat menarik ini, tidak boleh tidak kita harus membongkar template guna menyimpan kode CSS dan xHTML pada bagian header dan body. Untuk penyimpanan xHTML dengan amat terpaksa juga harus kita lakukan melalui Expand Widget Template , karena tanpa melalui proses ini tidak mungkin apa yang kita rencanakan bisa terwujud. Heh ... heh ..., tapi jangan ...
Post a Comment
Readmore