SlideShare a Scribd company logo
1 of 4
Download to read offline
Membuat slide show pada posting
Buat sobat yang mau mencoba untuk blog sobat cara agak gampang-gampang susah alias gasus , tapi
kalau sobat teliti cara nya cukup mudah yaitu copy paste kode di bawah ini kehalaman HTML Postingan
blog
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"
type="text/javascript"></script>
<script src="http://s3slider-original.googlecode.com/svn/trunk/s3Slider.js"
type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#BUS-slider').s3Slider({
timeOut: 3000
});
});
</script>
<style>
#BUS-slider {
width: 550px; /* Keep it 20px-40PX greater than ACTUAL Image size */
height: 335px;
position: relative;
overflow: hidden;
margin-left: 0;
}
#BUS-sliderContent {
width: 550px;
position: absolute;
top: 0;
margin-left: 0;
}
.BUS-sliderImage {
float: left;
position: relative;
display: none; top: 0;
border:1px solid #ddd;
}
.BUS-sliderImage span {
position: absolute;
font: 10px/15px sans-serif,Arial, Helvetica;
padding: 10px 10px;
background-color: #000;
color: #fff;
filter:'alpha(opacity=70)';
-moz-opacity: .5;
-khtml-opacity: .5;
opacity: .5;
text-align:justify;
}
.BUS-sliderImage span a {
text-decoration:underline;
color:#FE6602;
}
.clear {
clear: both;
}
.top {
top: 0;
left: 0;
width: 550px !important;
height: 70px;
}
.bottom {
bottom: 0;
left: 0;
width: 550px !important;
height:90px;
}
.left {
left: 0;
top: 0;
width: 110px !important;
height: 335px;
}
.right {
right: 0;
bottom: 0;
width: 110px !important;
height: 315px;
}
</style>
<br />
<div id="BUS-slider">
<ul id="BUS-sliderContent">
<li class="BUS-sliderImage">
<img height="335" src="http://3.bp.blogspot.com/-1nqN2n-
bxqc/UOlEiGJN40I/AAAAAAAAE9A/dCelZ2rCb2E/s1600/Untitled-2.jpg" width="550" /><a
href="http://blog-rangga.blogspot.com/"><span class="top"><h3> Mother And Rangga</h3>
The road to the lake Singkarak west sumatera all back home</span></a><span class="short_text"
id="result_box" lang="en"><span class="hps"></span></span>
</li>
<li class="BUS-sliderImage">
<img height="335" src="http://1.bp.blogspot.com/-
jKNi9EeXeEk/UOlEudoq3hI/AAAAAAAAE9U/0lnuoRGv6UQ/s1600/Untitled-6.jpg" width="550" /><a
href="http://blog-rangga.blogspot.com/"><span class="top"><h3>
Mother And Rangga</h3>
Rangga photo on the bridge leighton III</span></a><span class="short_text" id="result_box"
lang="en"><span class="hps"></span></span>
</li>
<li class="BUS-sliderImage">
<a href="http://blog-rangga.blogspot.com/"><img height="335" src="http://1.bp.blogspot.com/-
haXpszup8FE/UOlsZL5WxTI/AAAAAAAAE-A/XUGrXP7vviA/s1600/Untitled-1.jpg" width="550" />
<span class="top"><h3>
Rangga photo</h3>
Rangga in the Clock Tower Bukitinggi West Sumatera</span>
</a></li>
<li class="BUS-sliderImage">
<a href="http://blog-rangga.blogspot.com/"><img height="335" src="http://1.bp.blogspot.com/-
HTT6ExcljAU/UOmTXLaInDI/AAAAAAAAE-Q/UNJRmGExphE/s1600/Untitled-1.jpg" width="550" />
<span class="bottom"><h3>
Rangga Photo</h3>
Rangga posing overpass Kelok sembilan west sumatera</span>
</a></li>
<li class="BUS-sliderImage">
<a href="http://blog-rangga.blogspot.com/"><img height="335" src="http://4.bp.blogspot.com/-
387pM5uD_yo/UOmTjcug3rI/AAAAAAAAE-c/eZv82I8P1Bo/s1600/Untitled-2.jpg" width="550" />
<span class="bottom"><h3>
Rangga , Father and Mother</h3>
Rangga with beloved family</span>
</a></li>
<div class="clear BUS-sliderImage">
</div>
</ul>
</div>
<br />
Keterangan :
 Kode yang berwarna Orange atau kuning adalah URL yang bisa sobat ganti dengan URL
blog sobat.
 Kode warna merah adalah URL Gambar , ganti dengan URL blog yang mau sobat
tampilkan
 Tulisan warna hijau atau green Ganti dengan judul yang sobat inginkan kan
 Tulisan warna biru ganti dengan deskripsi

More Related Content

What's hot

SC5 Style Guide Generator
SC5 Style Guide GeneratorSC5 Style Guide Generator
SC5 Style Guide GeneratorVarya Stepanova
 
Pre-render Blazor WebAssembly on static web hosting at publishing time
Pre-render Blazor WebAssembly on static web hosting at publishing timePre-render Blazor WebAssembly on static web hosting at publishing time
Pre-render Blazor WebAssembly on static web hosting at publishing timeJun-ichi Sakamoto
 
Story about module management with angular.js
Story about module management with angular.jsStory about module management with angular.js
Story about module management with angular.jsDavid Amend
 
Implementation of GUI Framework part3
Implementation of GUI Framework part3Implementation of GUI Framework part3
Implementation of GUI Framework part3masahiroookubo
 
multiple views and routing
multiple views and routingmultiple views and routing
multiple views and routingBrajesh Yadav
 
Implementation of gui framework part1
Implementation of gui framework part1Implementation of gui framework part1
Implementation of gui framework part1masahiroookubo
 
Implementation of gui framework part2
Implementation of gui framework part2Implementation of gui framework part2
Implementation of gui framework part2masahiroookubo
 
Integrating Browserify with Sprockets
Integrating Browserify with SprocketsIntegrating Browserify with Sprockets
Integrating Browserify with SprocketsSpike Brehm
 
Web Components
Web ComponentsWeb Components
Web ComponentsLoc Nguyen
 
JavaScript on Rails 튜토리얼
JavaScript on Rails 튜토리얼JavaScript on Rails 튜토리얼
JavaScript on Rails 튜토리얼Sukjoon Kim
 
서비스 운영을 위한 디자인시스템 프로젝트
서비스 운영을 위한 디자인시스템 프로젝트서비스 운영을 위한 디자인시스템 프로젝트
서비스 운영을 위한 디자인시스템 프로젝트NAVER Engineering
 
Service Worker 201 (en)
Service Worker 201 (en)Service Worker 201 (en)
Service Worker 201 (en)Chang W. Doh
 
J day la 2011 webmatrix
J day la 2011 webmatrixJ day la 2011 webmatrix
J day la 2011 webmatrixAlice Pang
 

What's hot (20)

SC5 Style Guide Generator
SC5 Style Guide GeneratorSC5 Style Guide Generator
SC5 Style Guide Generator
 
Pre-render Blazor WebAssembly on static web hosting at publishing time
Pre-render Blazor WebAssembly on static web hosting at publishing timePre-render Blazor WebAssembly on static web hosting at publishing time
Pre-render Blazor WebAssembly on static web hosting at publishing time
 
DevNexus 2016
DevNexus 2016DevNexus 2016
DevNexus 2016
 
Story about module management with angular.js
Story about module management with angular.jsStory about module management with angular.js
Story about module management with angular.js
 
Implementation of GUI Framework part3
Implementation of GUI Framework part3Implementation of GUI Framework part3
Implementation of GUI Framework part3
 
multiple views and routing
multiple views and routingmultiple views and routing
multiple views and routing
 
Implementation of gui framework part1
Implementation of gui framework part1Implementation of gui framework part1
Implementation of gui framework part1
 
Mobile Web Design Code
Mobile Web Design CodeMobile Web Design Code
Mobile Web Design Code
 
Implementation of gui framework part2
Implementation of gui framework part2Implementation of gui framework part2
Implementation of gui framework part2
 
Integrating Browserify with Sprockets
Integrating Browserify with SprocketsIntegrating Browserify with Sprockets
Integrating Browserify with Sprockets
 
Web Components
Web ComponentsWeb Components
Web Components
 
JavaScript on Rails 튜토리얼
JavaScript on Rails 튜토리얼JavaScript on Rails 튜토리얼
JavaScript on Rails 튜토리얼
 
Ruby course-4-practice
Ruby course-4-practiceRuby course-4-practice
Ruby course-4-practice
 
Os mobile
Os mobileOs mobile
Os mobile
 
Lightning fast sass
Lightning fast sassLightning fast sass
Lightning fast sass
 
서비스 운영을 위한 디자인시스템 프로젝트
서비스 운영을 위한 디자인시스템 프로젝트서비스 운영을 위한 디자인시스템 프로젝트
서비스 운영을 위한 디자인시스템 프로젝트
 
Web Workers
Web WorkersWeb Workers
Web Workers
 
Service Worker 201 (en)
Service Worker 201 (en)Service Worker 201 (en)
Service Worker 201 (en)
 
J day la 2011 webmatrix
J day la 2011 webmatrixJ day la 2011 webmatrix
J day la 2011 webmatrix
 
Os mobile
Os mobileOs mobile
Os mobile
 

Viewers also liked

Pengubahsuaian astrolab mengikut standard Malaysia untuk kegunaan pengiraan w...
Pengubahsuaian astrolab mengikut standard Malaysia untuk kegunaan pengiraan w...Pengubahsuaian astrolab mengikut standard Malaysia untuk kegunaan pengiraan w...
Pengubahsuaian astrolab mengikut standard Malaysia untuk kegunaan pengiraan w...hafizsafiai
 
Slide metafizik tasawwuf pada persidangan University Research Conference, 15...
Slide metafizik  tasawwuf pada persidangan University Research Conference, 15...Slide metafizik  tasawwuf pada persidangan University Research Conference, 15...
Slide metafizik tasawwuf pada persidangan University Research Conference, 15...dara aisyah
 
Ki̇şi̇sel geli̇şi̇m hayat boyu öğrenme
Ki̇şi̇sel geli̇şi̇m hayat boyu öğrenmeKi̇şi̇sel geli̇şi̇m hayat boyu öğrenme
Ki̇şi̇sel geli̇şi̇m hayat boyu öğrenmeErdem Karagöz
 
Sübliminal mesaj
Sübliminal mesajSübliminal mesaj
Sübliminal mesajDukkanAjans
 
Kumpulan Jurnal dan Karya Ilmiah
Kumpulan Jurnal dan Karya IlmiahKumpulan Jurnal dan Karya Ilmiah
Kumpulan Jurnal dan Karya IlmiahFahmy Metala
 
Penulisan Ilmiah Pengurusan Penggunaan Media Grafik dalam PdP Berasaskan Mode...
Penulisan Ilmiah Pengurusan Penggunaan Media Grafik dalam PdP Berasaskan Mode...Penulisan Ilmiah Pengurusan Penggunaan Media Grafik dalam PdP Berasaskan Mode...
Penulisan Ilmiah Pengurusan Penggunaan Media Grafik dalam PdP Berasaskan Mode...Sherly Jewinly
 
Pipe network analysis with examples
Pipe network analysis with examplesPipe network analysis with examples
Pipe network analysis with examplesMohsin Siddique
 

Viewers also liked (9)

Metafizik
MetafizikMetafizik
Metafizik
 
Pengubahsuaian astrolab mengikut standard Malaysia untuk kegunaan pengiraan w...
Pengubahsuaian astrolab mengikut standard Malaysia untuk kegunaan pengiraan w...Pengubahsuaian astrolab mengikut standard Malaysia untuk kegunaan pengiraan w...
Pengubahsuaian astrolab mengikut standard Malaysia untuk kegunaan pengiraan w...
 
Slide metafizik tasawwuf pada persidangan University Research Conference, 15...
Slide metafizik  tasawwuf pada persidangan University Research Conference, 15...Slide metafizik  tasawwuf pada persidangan University Research Conference, 15...
Slide metafizik tasawwuf pada persidangan University Research Conference, 15...
 
Ki̇şi̇sel geli̇şi̇m hayat boyu öğrenme
Ki̇şi̇sel geli̇şi̇m hayat boyu öğrenmeKi̇şi̇sel geli̇şi̇m hayat boyu öğrenme
Ki̇şi̇sel geli̇şi̇m hayat boyu öğrenme
 
Sübliminal mesaj
Sübliminal mesajSübliminal mesaj
Sübliminal mesaj
 
Lomba Cerdas Cermat
Lomba Cerdas CermatLomba Cerdas Cermat
Lomba Cerdas Cermat
 
Kumpulan Jurnal dan Karya Ilmiah
Kumpulan Jurnal dan Karya IlmiahKumpulan Jurnal dan Karya Ilmiah
Kumpulan Jurnal dan Karya Ilmiah
 
Penulisan Ilmiah Pengurusan Penggunaan Media Grafik dalam PdP Berasaskan Mode...
Penulisan Ilmiah Pengurusan Penggunaan Media Grafik dalam PdP Berasaskan Mode...Penulisan Ilmiah Pengurusan Penggunaan Media Grafik dalam PdP Berasaskan Mode...
Penulisan Ilmiah Pengurusan Penggunaan Media Grafik dalam PdP Berasaskan Mode...
 
Pipe network analysis with examples
Pipe network analysis with examplesPipe network analysis with examples
Pipe network analysis with examples
 

Similar to Membuat slide show pada posting

CSS3 Takes on the World
CSS3 Takes on the WorldCSS3 Takes on the World
CSS3 Takes on the WorldJonathan Snook
 
Private slideshow
Private slideshowPrivate slideshow
Private slideshowsblackman
 
Presentation html5 css3 by thibaut
Presentation html5 css3 by thibautPresentation html5 css3 by thibaut
Presentation html5 css3 by thibautThibaut Baillet
 
All you need to know about JavaScript loading and execution in the browser - ...
All you need to know about JavaScript loading and execution in the browser - ...All you need to know about JavaScript loading and execution in the browser - ...
All you need to know about JavaScript loading and execution in the browser - ...Caelum
 
The Future of CSS with Web components
The Future of CSS with Web componentsThe Future of CSS with Web components
The Future of CSS with Web componentsdevObjective
 
The Future of CSS with Web Components
The Future of CSS with Web ComponentsThe Future of CSS with Web Components
The Future of CSS with Web ComponentsColdFusionConference
 
Web Design Course - Lecture 18 - Boostrap, Gatting started, grid system, tables
Web Design Course - Lecture 18 - Boostrap, Gatting started, grid system, tablesWeb Design Course - Lecture 18 - Boostrap, Gatting started, grid system, tables
Web Design Course - Lecture 18 - Boostrap, Gatting started, grid system, tablesAl-Mamun Sarkar
 
Creative chase busting v2
Creative chase busting   v2Creative chase busting   v2
Creative chase busting v2b3333333333jal
 
Design+Performance Velocity 2015
Design+Performance Velocity 2015Design+Performance Velocity 2015
Design+Performance Velocity 2015Steve Souders
 
Codigo123
Codigo123Codigo123
Codigo123ALFA7
 
Oracle Application Express & jQuery Mobile - OGh Apex Dag 2012
Oracle Application Express & jQuery Mobile - OGh Apex Dag 2012Oracle Application Express & jQuery Mobile - OGh Apex Dag 2012
Oracle Application Express & jQuery Mobile - OGh Apex Dag 2012crokitta
 
Design & Performance - Steve Souders at Fastly Altitude 2015
Design & Performance - Steve Souders at Fastly Altitude 2015Design & Performance - Steve Souders at Fastly Altitude 2015
Design & Performance - Steve Souders at Fastly Altitude 2015Fastly
 
JavaScript Performance (at SFJS)
JavaScript Performance (at SFJS)JavaScript Performance (at SFJS)
JavaScript Performance (at SFJS)Steve Souders
 
JavaScript Perfomance
JavaScript PerfomanceJavaScript Perfomance
JavaScript PerfomanceAnatol Alizar
 
лукьянченко л.а. пос 10а
лукьянченко л.а. пос 10алукьянченко л.а. пос 10а
лукьянченко л.а. пос 10аl10bov
 
[wcatx] Adaptive Images in Responsive Web Design
[wcatx] Adaptive Images in Responsive Web Design[wcatx] Adaptive Images in Responsive Web Design
[wcatx] Adaptive Images in Responsive Web DesignChristopher Schmitt
 

Similar to Membuat slide show pada posting (20)

CSS3 Takes on the World
CSS3 Takes on the WorldCSS3 Takes on the World
CSS3 Takes on the World
 
Private slideshow
Private slideshowPrivate slideshow
Private slideshow
 
Presentation html5 css3 by thibaut
Presentation html5 css3 by thibautPresentation html5 css3 by thibaut
Presentation html5 css3 by thibaut
 
Upload[1]
Upload[1]Upload[1]
Upload[1]
 
All you need to know about JavaScript loading and execution in the browser - ...
All you need to know about JavaScript loading and execution in the browser - ...All you need to know about JavaScript loading and execution in the browser - ...
All you need to know about JavaScript loading and execution in the browser - ...
 
The Future of CSS with Web components
The Future of CSS with Web componentsThe Future of CSS with Web components
The Future of CSS with Web components
 
The Future of CSS with Web Components
The Future of CSS with Web ComponentsThe Future of CSS with Web Components
The Future of CSS with Web Components
 
Web Design Course - Lecture 18 - Boostrap, Gatting started, grid system, tables
Web Design Course - Lecture 18 - Boostrap, Gatting started, grid system, tablesWeb Design Course - Lecture 18 - Boostrap, Gatting started, grid system, tables
Web Design Course - Lecture 18 - Boostrap, Gatting started, grid system, tables
 
Creative chase busting v2
Creative chase busting   v2Creative chase busting   v2
Creative chase busting v2
 
Design+Performance Velocity 2015
Design+Performance Velocity 2015Design+Performance Velocity 2015
Design+Performance Velocity 2015
 
Codigo123
Codigo123Codigo123
Codigo123
 
Oracle Application Express & jQuery Mobile - OGh Apex Dag 2012
Oracle Application Express & jQuery Mobile - OGh Apex Dag 2012Oracle Application Express & jQuery Mobile - OGh Apex Dag 2012
Oracle Application Express & jQuery Mobile - OGh Apex Dag 2012
 
Design & Performance - Steve Souders at Fastly Altitude 2015
Design & Performance - Steve Souders at Fastly Altitude 2015Design & Performance - Steve Souders at Fastly Altitude 2015
Design & Performance - Steve Souders at Fastly Altitude 2015
 
JavaScript Performance (at SFJS)
JavaScript Performance (at SFJS)JavaScript Performance (at SFJS)
JavaScript Performance (at SFJS)
 
JavaScript Perfomance
JavaScript PerfomanceJavaScript Perfomance
JavaScript Perfomance
 
лукьянченко л.а. пос 10а
лукьянченко л.а. пос 10алукьянченко л.а. пос 10а
лукьянченко л.а. пос 10а
 
Html5 intro
Html5 introHtml5 intro
Html5 intro
 
15 months of AMP
15 months of AMP15 months of AMP
15 months of AMP
 
[wcatx] Adaptive Images in Responsive Web Design
[wcatx] Adaptive Images in Responsive Web Design[wcatx] Adaptive Images in Responsive Web Design
[wcatx] Adaptive Images in Responsive Web Design
 
smoke1272528461
smoke1272528461smoke1272528461
smoke1272528461
 

More from Jonathan Liviera Marpaunk (13)

Surat Pemanggilan Peserta Olimpiade Tingkat Nasional 2014
Surat Pemanggilan Peserta Olimpiade Tingkat Nasional 2014Surat Pemanggilan Peserta Olimpiade Tingkat Nasional 2014
Surat Pemanggilan Peserta Olimpiade Tingkat Nasional 2014
 
19
1919
19
 
20
2020
20
 
UN Fisika paket 21
UN Fisika paket 21UN Fisika paket 21
UN Fisika paket 21
 
Kumpulan maskot SMA N 2 Tebo
Kumpulan maskot SMA N 2 TeboKumpulan maskot SMA N 2 Tebo
Kumpulan maskot SMA N 2 Tebo
 
Materi olimpiade fisikabagian a
Materi olimpiade fisikabagian aMateri olimpiade fisikabagian a
Materi olimpiade fisikabagian a
 
Materi olimpiade fisika Mekanika bagian b
Materi olimpiade fisika Mekanika bagian bMateri olimpiade fisika Mekanika bagian b
Materi olimpiade fisika Mekanika bagian b
 
Materi olimpiade fisika Mekanika bagian c
Materi olimpiade fisika Mekanika bagian cMateri olimpiade fisika Mekanika bagian c
Materi olimpiade fisika Mekanika bagian c
 
Materi olimpiade fisika Mekanika bagian D
Materi olimpiade fisika Mekanika bagian DMateri olimpiade fisika Mekanika bagian D
Materi olimpiade fisika Mekanika bagian D
 
Materi olimpiade fisika Mekanika bagian e
Materi olimpiade fisika Mekanika bagian eMateri olimpiade fisika Mekanika bagian e
Materi olimpiade fisika Mekanika bagian e
 
Materi olimpiade fisika Mekanika bagian F
Materi olimpiade fisika Mekanika bagian FMateri olimpiade fisika Mekanika bagian F
Materi olimpiade fisika Mekanika bagian F
 
Soal latihan-olimpiade-fisika-sma
Soal latihan-olimpiade-fisika-smaSoal latihan-olimpiade-fisika-sma
Soal latihan-olimpiade-fisika-sma
 
Membuat hexagonal 3D prisma dengan coreldraw
Membuat hexagonal 3D prisma dengan coreldrawMembuat hexagonal 3D prisma dengan coreldraw
Membuat hexagonal 3D prisma dengan coreldraw
 

Recently uploaded

STITCH: HOW MIGHT WE PROMOTE AN EQUITABLE AND INCLUSIVE URBAN LIFESTYLE PRIOR...
STITCH: HOW MIGHT WE PROMOTE AN EQUITABLE AND INCLUSIVE URBAN LIFESTYLE PRIOR...STITCH: HOW MIGHT WE PROMOTE AN EQUITABLE AND INCLUSIVE URBAN LIFESTYLE PRIOR...
STITCH: HOW MIGHT WE PROMOTE AN EQUITABLE AND INCLUSIVE URBAN LIFESTYLE PRIOR...Pranav Subramanian
 
PORTFOLIO 2024_ANASTASIYA KUDINOVA / EXTENDED VERSION
PORTFOLIO 2024_ANASTASIYA KUDINOVA / EXTENDED VERSIONPORTFOLIO 2024_ANASTASIYA KUDINOVA / EXTENDED VERSION
PORTFOLIO 2024_ANASTASIYA KUDINOVA / EXTENDED VERSIONAnastasiya Kudinova
 
FW25-26 Knit Cut & Sew Trend Book Peclers Paris
FW25-26 Knit Cut & Sew Trend Book Peclers ParisFW25-26 Knit Cut & Sew Trend Book Peclers Paris
FW25-26 Knit Cut & Sew Trend Book Peclers ParisPeclers Paris
 
Karim apartment ideas 01 ppppppppppppppp
Karim apartment ideas 01 pppppppppppppppKarim apartment ideas 01 ppppppppppppppp
Karim apartment ideas 01 pppppppppppppppNadaMohammed714321
 
Highway LOS - Freeway-- Multilane -- highway class 2 & 3 Housam Siyoufi
Highway LOS - Freeway-- Multilane -- highway class 2 & 3 Housam SiyoufiHighway LOS - Freeway-- Multilane -- highway class 2 & 3 Housam Siyoufi
Highway LOS - Freeway-- Multilane -- highway class 2 & 3 Housam Siyoufisiyoufihoussam
 
_Neighborhood Planning in Capital City of Chandigarh- An Appraisal (2) - Copy...
_Neighborhood Planning in Capital City of Chandigarh- An Appraisal (2) - Copy..._Neighborhood Planning in Capital City of Chandigarh- An Appraisal (2) - Copy...
_Neighborhood Planning in Capital City of Chandigarh- An Appraisal (2) - Copy...JIT KUMAR GUPTA
 
Cities Light Up in Solidarity With Ukraine: From Internationally Synchronized...
Cities Light Up in Solidarity With Ukraine: From Internationally Synchronized...Cities Light Up in Solidarity With Ukraine: From Internationally Synchronized...
Cities Light Up in Solidarity With Ukraine: From Internationally Synchronized...Thomas Schielke
 
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...Pranav Subramanian
 
City Hall London, Norman Foster building description with building details.pptx
City Hall London, Norman Foster building description with building details.pptxCity Hall London, Norman Foster building description with building details.pptx
City Hall London, Norman Foster building description with building details.pptxYaminiDabbara
 
Imagist3D Architectural and Interior Rendering Portfolio
Imagist3D Architectural and Interior Rendering PortfolioImagist3D Architectural and Interior Rendering Portfolio
Imagist3D Architectural and Interior Rendering PortfolioAlinaLau2
 
Piece by Piece Magazine
Piece by Piece Magazine                      Piece by Piece Magazine
Piece by Piece Magazine CharlottePulte
 
The spirit of digital place - game worlds and architectural phenomenology
The spirit of digital place - game worlds and architectural phenomenologyThe spirit of digital place - game worlds and architectural phenomenology
The spirit of digital place - game worlds and architectural phenomenologyChristopher Totten
 
How Apple strives for the perfect sky and revives cities
How Apple strives for the perfect sky and revives citiesHow Apple strives for the perfect sky and revives cities
How Apple strives for the perfect sky and revives citiesThomas Schielke
 
simpson-lee_house_dt20ajshsjsjsjsjj15.pdf
simpson-lee_house_dt20ajshsjsjsjsjj15.pdfsimpson-lee_house_dt20ajshsjsjsjsjj15.pdf
simpson-lee_house_dt20ajshsjsjsjsjj15.pdfLucyBonelli
 
Niintendo Wii Presentation Template.pptx
Niintendo Wii Presentation Template.pptxNiintendo Wii Presentation Template.pptx
Niintendo Wii Presentation Template.pptxKevinYaelJimnezSanti
 
General Simple Guide About AI in Design By: A.L. Samar Hossam ElDin
General Simple Guide About AI in Design By: A.L. Samar Hossam ElDinGeneral Simple Guide About AI in Design By: A.L. Samar Hossam ElDin
General Simple Guide About AI in Design By: A.L. Samar Hossam ElDinSamar Hossam ElDin Ahmed
 
ArtWaves 2024 - embracing Curves in Modern Homes
ArtWaves 2024 - embracing Curves in Modern HomesArtWaves 2024 - embracing Curves in Modern Homes
ArtWaves 2024 - embracing Curves in Modern HomesVellyslav Petrov
 
Karim apartment ideas 02 ppppppppppppppp
Karim apartment ideas 02 pppppppppppppppKarim apartment ideas 02 ppppppppppppppp
Karim apartment ideas 02 pppppppppppppppNadaMohammed714321
 
guest bathroom white and blue ssssssssss
guest bathroom white and blue ssssssssssguest bathroom white and blue ssssssssss
guest bathroom white and blue ssssssssssNadaMohammed714321
 
Map of St. Louis Parks
Map of St. Louis Parks                              Map of St. Louis Parks
Map of St. Louis Parks CharlottePulte
 

Recently uploaded (20)

STITCH: HOW MIGHT WE PROMOTE AN EQUITABLE AND INCLUSIVE URBAN LIFESTYLE PRIOR...
STITCH: HOW MIGHT WE PROMOTE AN EQUITABLE AND INCLUSIVE URBAN LIFESTYLE PRIOR...STITCH: HOW MIGHT WE PROMOTE AN EQUITABLE AND INCLUSIVE URBAN LIFESTYLE PRIOR...
STITCH: HOW MIGHT WE PROMOTE AN EQUITABLE AND INCLUSIVE URBAN LIFESTYLE PRIOR...
 
PORTFOLIO 2024_ANASTASIYA KUDINOVA / EXTENDED VERSION
PORTFOLIO 2024_ANASTASIYA KUDINOVA / EXTENDED VERSIONPORTFOLIO 2024_ANASTASIYA KUDINOVA / EXTENDED VERSION
PORTFOLIO 2024_ANASTASIYA KUDINOVA / EXTENDED VERSION
 
FW25-26 Knit Cut & Sew Trend Book Peclers Paris
FW25-26 Knit Cut & Sew Trend Book Peclers ParisFW25-26 Knit Cut & Sew Trend Book Peclers Paris
FW25-26 Knit Cut & Sew Trend Book Peclers Paris
 
Karim apartment ideas 01 ppppppppppppppp
Karim apartment ideas 01 pppppppppppppppKarim apartment ideas 01 ppppppppppppppp
Karim apartment ideas 01 ppppppppppppppp
 
Highway LOS - Freeway-- Multilane -- highway class 2 & 3 Housam Siyoufi
Highway LOS - Freeway-- Multilane -- highway class 2 & 3 Housam SiyoufiHighway LOS - Freeway-- Multilane -- highway class 2 & 3 Housam Siyoufi
Highway LOS - Freeway-- Multilane -- highway class 2 & 3 Housam Siyoufi
 
_Neighborhood Planning in Capital City of Chandigarh- An Appraisal (2) - Copy...
_Neighborhood Planning in Capital City of Chandigarh- An Appraisal (2) - Copy..._Neighborhood Planning in Capital City of Chandigarh- An Appraisal (2) - Copy...
_Neighborhood Planning in Capital City of Chandigarh- An Appraisal (2) - Copy...
 
Cities Light Up in Solidarity With Ukraine: From Internationally Synchronized...
Cities Light Up in Solidarity With Ukraine: From Internationally Synchronized...Cities Light Up in Solidarity With Ukraine: From Internationally Synchronized...
Cities Light Up in Solidarity With Ukraine: From Internationally Synchronized...
 
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
 
City Hall London, Norman Foster building description with building details.pptx
City Hall London, Norman Foster building description with building details.pptxCity Hall London, Norman Foster building description with building details.pptx
City Hall London, Norman Foster building description with building details.pptx
 
Imagist3D Architectural and Interior Rendering Portfolio
Imagist3D Architectural and Interior Rendering PortfolioImagist3D Architectural and Interior Rendering Portfolio
Imagist3D Architectural and Interior Rendering Portfolio
 
Piece by Piece Magazine
Piece by Piece Magazine                      Piece by Piece Magazine
Piece by Piece Magazine
 
The spirit of digital place - game worlds and architectural phenomenology
The spirit of digital place - game worlds and architectural phenomenologyThe spirit of digital place - game worlds and architectural phenomenology
The spirit of digital place - game worlds and architectural phenomenology
 
How Apple strives for the perfect sky and revives cities
How Apple strives for the perfect sky and revives citiesHow Apple strives for the perfect sky and revives cities
How Apple strives for the perfect sky and revives cities
 
simpson-lee_house_dt20ajshsjsjsjsjj15.pdf
simpson-lee_house_dt20ajshsjsjsjsjj15.pdfsimpson-lee_house_dt20ajshsjsjsjsjj15.pdf
simpson-lee_house_dt20ajshsjsjsjsjj15.pdf
 
Niintendo Wii Presentation Template.pptx
Niintendo Wii Presentation Template.pptxNiintendo Wii Presentation Template.pptx
Niintendo Wii Presentation Template.pptx
 
General Simple Guide About AI in Design By: A.L. Samar Hossam ElDin
General Simple Guide About AI in Design By: A.L. Samar Hossam ElDinGeneral Simple Guide About AI in Design By: A.L. Samar Hossam ElDin
General Simple Guide About AI in Design By: A.L. Samar Hossam ElDin
 
ArtWaves 2024 - embracing Curves in Modern Homes
ArtWaves 2024 - embracing Curves in Modern HomesArtWaves 2024 - embracing Curves in Modern Homes
ArtWaves 2024 - embracing Curves in Modern Homes
 
Karim apartment ideas 02 ppppppppppppppp
Karim apartment ideas 02 pppppppppppppppKarim apartment ideas 02 ppppppppppppppp
Karim apartment ideas 02 ppppppppppppppp
 
guest bathroom white and blue ssssssssss
guest bathroom white and blue ssssssssssguest bathroom white and blue ssssssssss
guest bathroom white and blue ssssssssss
 
Map of St. Louis Parks
Map of St. Louis Parks                              Map of St. Louis Parks
Map of St. Louis Parks
 

Membuat slide show pada posting

  • 1. Membuat slide show pada posting Buat sobat yang mau mencoba untuk blog sobat cara agak gampang-gampang susah alias gasus , tapi kalau sobat teliti cara nya cukup mudah yaitu copy paste kode di bawah ini kehalaman HTML Postingan blog <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> <script src="http://s3slider-original.googlecode.com/svn/trunk/s3Slider.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function() { $('#BUS-slider').s3Slider({ timeOut: 3000 }); }); </script> <style> #BUS-slider { width: 550px; /* Keep it 20px-40PX greater than ACTUAL Image size */ height: 335px; position: relative; overflow: hidden; margin-left: 0; } #BUS-sliderContent { width: 550px; position: absolute; top: 0; margin-left: 0; } .BUS-sliderImage { float: left; position: relative; display: none; top: 0; border:1px solid #ddd; } .BUS-sliderImage span { position: absolute; font: 10px/15px sans-serif,Arial, Helvetica;
  • 2. padding: 10px 10px; background-color: #000; color: #fff; filter:'alpha(opacity=70)'; -moz-opacity: .5; -khtml-opacity: .5; opacity: .5; text-align:justify; } .BUS-sliderImage span a { text-decoration:underline; color:#FE6602; } .clear { clear: both; } .top { top: 0; left: 0; width: 550px !important; height: 70px; } .bottom { bottom: 0; left: 0; width: 550px !important; height:90px; } .left { left: 0; top: 0; width: 110px !important; height: 335px; } .right { right: 0; bottom: 0; width: 110px !important; height: 315px; } </style> <br />
  • 3. <div id="BUS-slider"> <ul id="BUS-sliderContent"> <li class="BUS-sliderImage"> <img height="335" src="http://3.bp.blogspot.com/-1nqN2n- bxqc/UOlEiGJN40I/AAAAAAAAE9A/dCelZ2rCb2E/s1600/Untitled-2.jpg" width="550" /><a href="http://blog-rangga.blogspot.com/"><span class="top"><h3> Mother And Rangga</h3> The road to the lake Singkarak west sumatera all back home</span></a><span class="short_text" id="result_box" lang="en"><span class="hps"></span></span> </li> <li class="BUS-sliderImage"> <img height="335" src="http://1.bp.blogspot.com/- jKNi9EeXeEk/UOlEudoq3hI/AAAAAAAAE9U/0lnuoRGv6UQ/s1600/Untitled-6.jpg" width="550" /><a href="http://blog-rangga.blogspot.com/"><span class="top"><h3> Mother And Rangga</h3> Rangga photo on the bridge leighton III</span></a><span class="short_text" id="result_box" lang="en"><span class="hps"></span></span> </li> <li class="BUS-sliderImage"> <a href="http://blog-rangga.blogspot.com/"><img height="335" src="http://1.bp.blogspot.com/- haXpszup8FE/UOlsZL5WxTI/AAAAAAAAE-A/XUGrXP7vviA/s1600/Untitled-1.jpg" width="550" /> <span class="top"><h3> Rangga photo</h3> Rangga in the Clock Tower Bukitinggi West Sumatera</span> </a></li> <li class="BUS-sliderImage"> <a href="http://blog-rangga.blogspot.com/"><img height="335" src="http://1.bp.blogspot.com/- HTT6ExcljAU/UOmTXLaInDI/AAAAAAAAE-Q/UNJRmGExphE/s1600/Untitled-1.jpg" width="550" /> <span class="bottom"><h3> Rangga Photo</h3> Rangga posing overpass Kelok sembilan west sumatera</span> </a></li> <li class="BUS-sliderImage"> <a href="http://blog-rangga.blogspot.com/"><img height="335" src="http://4.bp.blogspot.com/- 387pM5uD_yo/UOmTjcug3rI/AAAAAAAAE-c/eZv82I8P1Bo/s1600/Untitled-2.jpg" width="550" /> <span class="bottom"><h3> Rangga , Father and Mother</h3> Rangga with beloved family</span> </a></li> <div class="clear BUS-sliderImage"> </div> </ul>
  • 4. </div> <br /> Keterangan :  Kode yang berwarna Orange atau kuning adalah URL yang bisa sobat ganti dengan URL blog sobat.  Kode warna merah adalah URL Gambar , ganti dengan URL blog yang mau sobat tampilkan  Tulisan warna hijau atau green Ganti dengan judul yang sobat inginkan kan  Tulisan warna biru ganti dengan deskripsi