Нүүр Blog Tips Blogger:Блогтоо зурагтай слайд хэрхэн хийх вэ?(SLIDE SHOW)

Blogger:Блогтоо зурагтай слайд хэрхэн хийх вэ?(SLIDE SHOW)

2011/02/15нд бичсэн: Боролдой 16

За та бүхэндээ блоггер блогтоо хэрхэн зурагтай слайд хийх хичээл орууллаа.ЗА хичээлдээ орцгооё!
Жишээ блог: Энд дар

№1

Blogger руу орж нэвтэрнэ.
Тэгээд Design–Edit HTML-ийг сонгоод Expand Widget Templates гэснийг чагтлана.

1. Одоо </head> гэсэн кодыг хайж олоод доорх кодыг яг доор нь хуулж тавина.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60

<script src='http://hicheelinfo.googlecode.com/files/jquery.js' type='text/javascript'/>
<script src='http://hicheelinfo.googlecode.com/files/s3Slider.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function() {
$('#slider').s3Slider({
timeOut: 3000
});
});
</script>

<style media='screen' type='text/css'>
#slider {
width: 410px; /* слайдны өргөн */
height: 300px; /* слайдны урт */
position: relative;
overflow: hidden;
}
#sliderContent {
width: 410px; /* слайдны өргөн 2 */
position: absolute;
top: 0;
margin-left: 0;
}
.sliderImage {
float: left;
position: relative;
display: none;
}
.sliderImage span {
position: absolute;
font: 10px/15px Arial, Helvetica, sans-serif;
padding: 10px 13px;
width: 384px;
background-color: #000;
filter: alpha(opacity=70);
-moz-opacity: 0.7;
-khtml-opacity: 0.7;
opacity: 0.7;
color: #fff;
display: none;
}
.clear {
clear: both;
}
.sliderImage span strong {
font-size: 14px;
}
.top {
top: 0;
left: 0;
}
.bottom {
bottom: 0;
left: 0;
}
ul { list-style-type: none;}
</style>

2. Дараан блогтоо шинэ видгеж үүсгэнэ… DESIGN->PAGE ELEMENTS->ADD A GADGET->HTML/JAVASCRIPT;

3. Тэгээд доорх кодыг хуулж тавиад хадгалаад таны слайд бэлэн болно

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

<center><div id="slider">
<ul id="sliderContent">
<li class="sliderImage">
<a href=""><img src="http://a6.sphotos.ak.fbcdn.net/hphotos-ak-ash2/154901_179779002048025_179777008714891_592221_4626164_n.jpg"/></a>
<span class="top"><strong>Слайдны гарчиг</strong><br />Слайдны тайлбар</span>
</li>
<li class="sliderImage">
<img src="http://a6.sphotos.ak.fbcdn.net/hphotos-ak-ash2/154901_179779002048025_179777008714891_592221_4626164_n.jpg"/>
<span class="top"><strong>Слайдны гарчиг</strong><br />Слайдны тайлбар</span>
</li>
<li class="sliderImage">
<img src="http://a6.sphotos.ak.fbcdn.net/hphotos-ak-ash2/154901_179779002048025_179777008714891_592221_4626164_n.jpg"/>
<span class="top"><strong>Слайдны гарчиг</strong><br />Слайдны тайлбар</span>
</li>
<div class="clear sliderImage"></div>
</ul>
</div></center>

4. Дараан SLide-тай видгежээ зөөнө

Боролдой
My twitter @boroldoi Facebook: fb.com/kolup Yahoo IM : boldush45

16 сэтгэгдэлтэй

Anonymous says:

2011/02/15 at 10:51 pm

слайд yu yum?????????????

Reply
- Боролдой says:
  
  2011/02/15 at 11:40 pm
  
  ХЭХЭ SLIDE SHOW
  
  Reply
Sunset says:

2011/02/16 at 7:19 pm

Jishee blog bhkuumuu

Reply
moose says:

2011/02/23 at 10:36 pm

oo sn oilgohgui bna sh de zyragtai hiilde

Reply
togoso says:

2011/03/07 at 6:04 pm

Your template is invalid because the tag ‘div’ appears inside of the tag ‘head’. ingesen bichig garaad bhiin yaahuu?

– enenees iluu yaj zuragtai oruulahiin dawarlaa l bnashd muusain yumnuud. oilgohgui bol hohi ni gej helehees

Reply
togoso says:

2011/03/07 at 6:18 pm

bolchihloo thanks. gehdee ene zurgii ni yaj solidog yum boloo?

Reply
Jack says:

2011/03/30 at 2:57 pm

ene bolj baigaa ch zurag n soligdohgui baina bas orson zuragnuud n daraalaad dooshoo garaad ireh ym yaj zasah be?

Reply
- Боролдой says:
  
  2011/03/30 at 4:08 pm
  
  Одоо болно css дутуу орсон байна!
  
  Reply
a says:

2011/03/30 at 10:36 pm

bolohgui bna

Reply
- Боролдой says:
  
  2011/03/30 at 10:41 pm
  
  уулан болоол байна даа!!
  
  Reply
Erdenebolor says:

2011/07/25 at 10:36 pm

blog hayg shineer neej bgaa yum a yaj powerpoint hicheelee blogtoo oruulah be hariu

Reply
- saku says:
  
  2011/07/25 at 11:47 pm
  
  http://www.slideshare.net iig ashigla
  
  Reply
♥Ганцаардсан нэгэн♥ says:

2011/11/12 at 12:05 am

Зураг хэрхэн нэмэх юм тэгээд!!

Reply
- saku says:
  
  2011/11/12 at 7:58 pm
  
  кодыг нь засаал
  
  Reply
sus says:

2012/08/17 at 10:27 pm

ene ehnii zurga ni deed taliin hedhen mm heseg garch ireed vldsen heseg ni garahq bna yagaad yum bol heleed ogooch?

Reply
Багвар says:

2013/03/06 at 11:18 am

Сайн байна уу Би хоёр хэсэг кодыг блогтоо зааварын дагуу татаж авсан Oдоо блог дээр хар дээр слайдны гарчиг слайдны тайлбар гэсэн гарч ороод байна Цааш яах вэ туслаарай

Reply

Blogger:Блогтоо зурагтай слайд хэрхэн хийх вэ?(SLIDE SHOW)

16 сэтгэгдэлтэй

Сэтгэгдэл бичих

Их үзсэн

Read previous post:

XML гэж юу вэ?