Other Share Slide của trang home website congnghe.5giay.vn/

nttruong · 6/6/14

dinhchi said: ↑

sao lại ko ảnh hưởng bác, tự nhiên lôi kéo theo 1 lũ css load cho khỏe trang à :v
Click to expand...

Nói là load. Nhưng kg css thì load kiểu gì?

Lê Tí · 7/6/14

namchelsea said: ↑

Tí đi bộ đội về ùi ak
Click to expand...

cảm ơn đã quan tâm nhưng rất tiếc là chưa

onemylove · 7/6/14

Lê Tí said: ↑

cảm ơn đã quan tâm nhưng rất tiếc là chưa
Click to expand...

Hình như Nghĩa vụ đang trong thời gian đc cho về vài ngày thì phải

Lê Tí · 7/6/14

onemylove said: ↑

Hình như Nghĩa vụ đang trong thời gian đc cho về vài ngày thì phải
Click to expand...

sai luôn rùi. Vẫn đang trong doanh trại

soulmasterbn · 7/6/14

namchelsea said: ↑

cái này share hêt rồi mà chẳng khác trang mình là mấy http://congdong24h.com
Click to expand...

cái web của bác có cái media dep day.share em dc k bác

onemylove · 7/6/14

Có bác nào share style Span.vn ko nhỉ

namchelsea · 7/6/14

soulmasterbn said: ↑

cái web của bác có cái media dep day.share em dc k bác
Click to expand...

EWRblock_MediaRecent:

<xen:require css="EWRmedio.css" />
<xen:require css="member_list.css" />

<div class="section mediaRecent">
<div class="mediaSmall" id="mediaRecent">
<div class="title_ribbon"><a href="{xen:link media}" title="{xenhrase recent_media}" ><span class="theribbon">{xenhrase recent_media}</span></a></div>
<div class="clearfix"></div>

<xen:if hascontent="true">
<ul>
<xen:contentcheck>
<xen:foreach loop="$MediaRecent" value="$media">
<li>
<div class="mediaContent">
<div class="image">

<xen:if is="{$media.service_media} == 'gallery'">
<div class="overlays overBtmL"><b>{xenhrase x_images, 'count={$media.media_duration}'}</b></div>
<xen:else />
<div class="overlays overBtmR"><b><xen:if is="{$media.media_hours}">{$media.media_hours}:</xen:if>{$media.media_minutes}:{$media.media_seconds}</b></div>
</xen:if>

<a href="{xen:link 'full:media/media', $media}"><span class="media_play"></span><img src="{xen:helper medio, $media}" border="0" alt="{$media.media_title}" /></a>
</div>

<div class="title">
<a href="{xen:link 'full:media/media', $media}">{$media.media_title}</a>
</div>
</div>
</li>
</xen:foreach>
</xen:contentcheck>
</ul>
</xen:if>

</div>
</div>
Click to expand...

EWRmedio.css:

/*** Ribbon style **/
.clearfix {clear:both}
.title_ribbon {float:left;position:relative;margin: 15px 0;}
.theribbon{position: relative;font-size: 1.2em;font-family: UTM_Header, arial;text-transform: uppercase;font-weight: bold;padding: 4px 25px 6px 25px;margin-left: -17px;-webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px; -khtml-border-bottom-left-radius: 5px; border-bottom-left-radius: 5px;color: #fff;background-color: rgb(88, 190, 231);text-shadow: 0 0 0 transparent, 0px 1px 2px #bbb}
.theribbon:before, .theribbon:after,.block-title .tab1 span:before {content: ' ';position: absolute;width: 0;height: 0;}
/*.theribbon:after{left: 0px;top: 100%;border-width: 5px 7px;border-style: solid;border-color: #555 #555 transparent transparent ;}
.theribbon:before,.block-title .tab1 span:before{left: 0px;bottom: 100%;border-width: 5px 7px;border-style: solid;border-color: transparent #555 #555 transparent;}*/
.theribbon:before,.block-title .tab1 span:before{width:7px;height:5px;-webkit-border-top-left-radius: 5px; -moz-border-radius-topleft: 5px; -khtml-border-top-left-radius: 5px; border-top-left-radius: 5px;background:#444;left: 0px;top:-5px}
.title_ribbon:after{content: '';position: absolute;display: block;bottom: -7px;border-width: 1.3em 0.9em;right: -1.6em;border-style: solid;border-color: transparent transparent rgb(88, 190, 231) rgb(88, 190, 231);}
.mediaRecent .theribbon {margin-left:-7px;top:-5px;}
.mediaRecent .title_ribbon:after {bottom:-1px}
.categoryText .title_ribbon:after {bottom:-2px;right: -35px;border-width: 18px}

.queueList table, .serviceList table { width: 100%; }
.queueList .buttons, .serviceList .buttons { text-decoration: none !important; text-align: right; }
.sectionMain.mediaFilter { float: right; margin: -50px auto 0px; }
.sectionMain.mediaFilter input { width: 120px; }
.pairsInline .removeFilter img { height: 24px; width: 24px; }
.pairsInline.userPairs { margin-right: 20px; }

.medioMain .tabs { margin-bottom: -3px; padding: 0 20px; background: transparent }
.medioMain table.dataTable .muted { font-size: 0.8em; padding: 10px; }
.medioMain table.dataTable .small { width: 1%; }
.medioMain table.dataTable .small .thumb { position: relative; }
.medioMain table.dataTable .large { width: 100%; }
.medioMain table.dataTable .infoOuter { position: relative; height: 35px; }
.medioMain table.dataTable .infoInner { position: absolute; width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis}

.medioMain table.dataTable .thumb img { height: 60px; }
.medioMain table.dataTable .edit { text-align: center; }
.medioMain table.dataTable .stat { width: 70px; text-align: right; }
.medioMain table.dataTable .overlay { background: black; padding: 5px; color: white; }
/* clearfix */ .medioMain table.dataTable .overlay { zoom: 1; } .medioMain table.dataTable .overlay:after { content: '.'; display: block; height: 0; clear: both; visibility: hidden; }

.mediaPlayLists ul { text-align: center; }
.mediaPlayLists li { position: relative; vertical-align: top; display: inline-block; width: 32.5%; min-width: 200px; max-width: 350px; }
.mediaPlayLists li .secondaryContent { margin: 10px 3px 0px; padding: 10px; }
.mediaPlayLists li .thumb { position: relative; }
.mediaPlayLists li .thumb a { color: white; }
.mediaPlayLists li .thumb img { width: 100%; margin-bottom: -3px; }
.mediaPlayLists li .thumb .overlay { display: none; position: absolute; top: 0; bottom: 0; width: 100%; background: url(rgba.php?r=0&g=0&b=0&a=153); background: rgba(0,0,0,0.6); _filter: progidXImageTransform.Microsoft.gradient(startColorstr=#99000000,endColorstr=#99000000);; }
.mediaPlayLists li .thumb .overlay .playAll { position: absolute; top: 50%; left: 0; right: 60px; text-align: center; font-size: 1.5em; margin-top: -15px; }
.mediaPlayLists li .thumb a:hover .overlay { display: block; }
.mediaPlayLists li .sidebar { position: absolute; top: 0; right: 0; width: 60px; height: 100%; background: url(rgba.php?r=0&g=0&b=0&a=153); background: rgba(0,0,0,0.6); _filter: progidXImageTransform.Microsoft.gradient(startColorstr=#99000000,endColorstr=#99000000);; overflow: hidden; }
.mediaPlayLists li .sidebar .count { padding: 5px; }
.mediaPlayLists li .sidebar .count b { font-size: 14px; }
.mediaPlayLists li .sidebar .sidethumb { border: 1px solid gray; margin: 0px 6px 4px; }
.mediaPlayLists li .title { font-size: 12px; height: 30px; overflow: hidden; overflow: hidden; margin-top: 10px; }
.mediaPlayLists li .info { font-size: 11px; white-space: nowrap; overflow: hidden; margin-top: 5px; }

.mediaList ul { text-align: center; }
.mediaList li { position: relative; vertical-align: top; display: inline-block; width: 32.5%; max-width: 250px; }
.mediaList li .secondaryContent { margin: 10px 3px 0px; padding: 10px; }
.mediaList li .thumb { position: relative; }
.mediaList li .title { font-size: 12px; height: 30px; overflow: hidden; margin-top: 5px; }
.mediaList li .info { font-size: 11px; white-space: nowrap; overflow: hidden; margin-top: 5px; }

.mediaSmall ul { text-align: center; }
.mediaSmall li { position: relative; vertical-align: top; float:left; width: 20%; }
.mediaSmall li .mediaContent { margin: 0px 3px 10px; }
.mediaSmall li .mediaContent .title {overflow: hidden; width:98%;padding-top:5px;line-height:18px}
.mediaSmall li .mediaContent .title a {color:#fff}
.mediaSmall li .mediaContent .image { position: relative; z-index: 1; }
.mediaSmall li .mediaContent .image img { width: 95%; }
.mediaSmall li span.media_play {background:url(http://xen.muabantop.com/styles/def...eat;position:absolute;top:34%;right:39%;width: 36px;height: 36px;background-size: 36px;}
.mediaSmall .block-title {border-bottom:none;margin-bottom: 15px;margin-left: -15px;}
.mediaSmall .block-title span {background-position: 100% -80px!important;}
.mediaRecent {float:left;background:#2c2c2c;margin:0 -10px 10px}
.mediaNav .pairsJustified dl { margin-left: 5px; margin-top: 2px; }

.mediaCloud #keywordCloud { margin: -25px -10px -30px; }
.mediaCloud #textCloud { margin: 25px 10px 30px; }
.mediaCloud ul { text-align: center; }
.mediaCloud li { display: inline; }

.mediaPlayList li { height: 70px; margin: 10px 0px; }
.mediaPlayList li .secondaryContent { height: 70px; padding: 0px; overflow: hidden; }

.mediaPlayList li .lastPost { float: right; padding: 15px 10px 0px 0px; }
.mediaPlayList li .subscribeOptions { float: left; padding: 25px 10px 0px; }

.mediaPlayList li .views { float: right; text-align: center; padding: 5px; margin: 13px; color: white; background-color: black; position: relative; z-index: 1; }
.mediaPlayList li .thumb { float: left; position: relative; }
.mediaPlayList li .thumb img { width: 120px; }
.mediaPlayList li .info { padding: 13px; overflow: hidden; }
.mediaPlayList li .info b { font-size: 1.1em; white-space: nowrap; }
.mediaPlayList li .info .muted { font-size: 0.8em; }
/* clearfix */ .mediaPlayList ul { zoom: 1; } .mediaPlayList ul:after { content: '.'; display: block; height: 0; clear: both; visibility: hidden; }

.mediaDetails .keywords li { display: inline; }
.mediaDetails .keywords li::after { content: ','; }
.mediaDetails .keywords li:last-child::after { content: ''; }

.mediaDetails img, .playlistDetails img,
.mediaDetails iframe, .playlistDetails iframe,
.mediaDetails object, .playlistDetails object,
.mediaDetails embed, .playlistDetails embed
{
max-width: 100%;
height: auto;
}

.messageSimpleList li:last-child { margin-bottom: 0px; }

.mediaKeywords ul { max-height: 200px; margin-left: 20px; overflow: auto; }
.mediaKeywords li { display: inline-block; width: 114px; }
.adminKeywords li { display: inline-block; width: 19%; padding: 2px; }
.adminKeywords li img { height: 13px; }
.booruKeywords dt img { height: 16px; float: left; margin-right: 5px; }

.mediaComments .pageNavLinkGroup,
.mediaPopout .pageNavLinkGroup { margin: 0px; }
.mediaComments .messageSimple { padding: 0 0px 10px !important; }
.mediaPopout .messageSimple { margin: 0 !important; }

.messageSimple textarea
{
height: 54px;
width: 100%;
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;
*width: 98%;
resize: vertical;
}
.messageSimple .submitUnit { margin-top: 5px; text-align: right; }

.overlays
{
background-color: black;
color: white;
font-size: 10px;
padding: 1px 2px 2px;
position: absolute;
}
.overlays.overTopL { top: 5px; left: 5px; }
.overlays.overTopR { top: 5px; right: 5px; }
.overlays.overBtmL { bottom: 8px; left: 5px; }
.overlays.overBtmR { bottom: 8px; right: 5px; }
.overlays a:link, .overlays a:visited { color: white; }

.oControl { width: 17px; height: 15px; float: left; position: static; }
.pControl { text-align: right; }
.pControl a { width: 18px; height: 15px; display: inline-block; }
.oNumbs { float: left; position: static; }

.oComms { background: url('styles/8wayrun/EWRmedio.png') -0px -40px; }
.oLikes { background: url('styles/8wayrun/EWRmedio.png') -20px -40px; }
.oViews { background: url('styles/8wayrun/EWRmedio.png') -40px -40px; }

.pRem { background: url('styles/8wayrun/EWRmedio.png') 0px 0px; }
.pTop { background: url('styles/8wayrun/EWRmedio.png') -20px 0px; }
.pUpp { background: url('styles/8wayrun/EWRmedio.png') -40px 0px; }
.pDwn { background: url('styles/8wayrun/EWRmedio.png') -60px 0px; }
.pBtm { background: url('styles/8wayrun/EWRmedio.png') -80px 0px; }

.pRem:hover { background: url('styles/8wayrun/EWRmedio.png') 0px -20px; }
.pTop:hover { background: url('styles/8wayrun/EWRmedio.png') -20px -20px; }
.pUpp:hover { background: url('styles/8wayrun/EWRmedio.png') -40px -20px; }
.pDwn:hover { background: url('styles/8wayrun/EWRmedio.png') -60px -20px; }
.pBtm:hover { background: url('styles/8wayrun/EWRmedio.png') -80px -20px; }

.medioBBc { text-align: center; margin: 5px 10px; }
.medioBBc .bbCodeBlock { width: 500px; display: inline-block; }
.medioBBc .bbCodeMedio { background-size: 100% !important; }
.medioBBc .bbCodeMedio img { max-height: 270px; }
.medioBBc a:hover, .medioBBc a:focus { background: transparent; }

.ctrlUnit dd .hint
{
font-size: 11px;
color: rgb(150,150,150);
margin-left: 16px;
margin-top: 2px;
}

.sortColumn .sortDelete { float: left; margin: 7px 0px 0px 100px; }
.sortColumn dt img { height: 38px; }
.sortColumn .portlet { border: 1px dotted rgb(150,150,150); }
.sortColumn .portlet-placeholder { border: 2px dashed rgb(68, 68, 68); height: 35px; }
.sortColumn .portlet-placeholder * { visibility: hidden; }

.queue .itemCount { background: #2b485c; float: none; padding: 3px; }
.queue .itemCount.alert
{
background-color: #e03030;
font-weight: bold;
font-size: 9px;
color: white;
}

.copyright { text-align: center; font-size: 11px; margin: 10px; }

<xen:if is="@enableResponsive">
@media (max-widthmaxResponsiveMediumWidth)
{
.mediaPlayLists li { width: 49%; }
.mediaList li { width: 49%; }
}
@media (max-widthmaxResponsiveNarrowWidth)
{
.mediaPlayLists li { width: 99%; }
.mediaList li .secondaryContent { padding: 0px; }
}
</xen:if>
Click to expand...

Cho HaTinh · 7/6/14

xem tham khảo, mình đc cái k thích làm trang home.

soulmasterbn · 7/6/14

namchelsea said: ↑

EWRblock_MediaRecent:

EWRmedio.css:
Click to expand...

bác ơi em k có template đó @@

piggy001 · 7/6/14

Thanks @nttruong cho cái hướng dẫn làm cái thanh menu màu đen có chữ đăng tin được ko ? khi kéo xuống nó chạy theo đó

onemylove · 17/6/14

Bác @nttruong cho e xin cái này đc hok @Lightness

onemylove · 17/6/14

Upppppppppppppp

votuonq · 4/7/14

onemylove said: ↑

Bác @nttruong cho e xin cái này đc hok @Lightness

Click to expand...

thêm đoạn code sau vào EXTRA.CSS

.LeftMenuFixed {
margin-left: -140px;
margin-top: -3px;
position: absolute;
width: 172px !important;
}

.LeftMenu_wrp {
background: none repeat scroll 0 0 #FFFFFF;
float: left;
margin-left: 0;
margin-right: 10px;
margin-top: 15px;
width: 130px;
}

.title_lmn1 .item_lmn {
background: none repeat scroll 0 0 #0093CC;
color: #FFFFFF;
}

.item_lmn {
-moz-border-bottom-colors: none;
-moz-border-left-colors: none;
-moz-border-right-colors: none;
-moz-border-top-colors: none;
border-color: -moz-use-text-color #D9D9D9 #D9D9D9;
border-image: none;
border-style: none solid solid;
border-width: medium 1px 1px;
color: #3870A0;
display: block;
font-size: 14px;
padding: 8px 10px;
text-align: center;
}

.title_lmn2 .item_lmn {
background: none repeat scroll 0 0 #E75218;
color: #FFFFFF;
}
Click to expand...

chèn đoạn code sau vào trong thẻ <head> teamplate page_container, link thím tự sửa nhé
HTML:
<div class="LeftMenuFixed scroll-to-fixed-fixed" style="z-index: 999; position: fixed; top: 224px; margin-left: 0px; width: 172px; left: 34.5px;">
<div class="LeftMenu_wrp">
<ul class="lmn_bock01">
<span class="title_lmn1">
<a class="item_lmn" href="#">Chủ đề HOT</a>
</span>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/ios-iphone-ipad-ipod/">iOS</a>
</li>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/android/">Android</a>
</li>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/windows-phone/">Windows Phone</a>
</li>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/blackberry/">BlackBerry</a>
</li>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/laptop/">Laptop</a>
</li>
</ul>
<ul class="lmn_bock02">
<span class="title_lmn2">
<a class="item_lmn" href="#">Cộng đồng</a>
</span>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/danh-gia-trai-nghiem/">Đánh giá</a>
</li>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/chuyen-tro/">Chuyện trò</a>
</li>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/su-kien-cong-nghe-offline/">Offline</a>
</li>
</ul>
</div>
<div class="clearFix"></div>
</div>

onemylove · 17/6/14

votuonq said: ↑

thêm những cái sau vào EXTRA.CSS

chèn đoạn code sau vào trong thẻ <head> teamplate page_container, link thím tự sửa nhé

HTML:

<div class="LeftMenuFixed scroll-to-fixed-fixed" style="z-index: 999; position: fixed; top: 224px; margin-left: 0px; width: 172px; left: 34.5px;">
<div class="LeftMenu_wrp">
<ul class="lmn_bock01">
<span class="title_lmn1">
<a class="item_lmn" href="#">Chủ đề HOT</a>
</span>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/ios-iphone-ipad-ipod/">iOS</a>
</li>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/android/">Android</a>
</li>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/windows-phone/">Windows Phone</a>
</li>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/blackberry/">BlackBerry</a>
</li>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/laptop/">Laptop</a>
</li>
</ul>
<ul class="lmn_bock02">
<span class="title_lmn2">
<a class="item_lmn" href="#">Cộng đồng</a>
</span>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/danh-gia-trai-nghiem/">Đánh giá</a>
</li>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/chuyen-tro/">Chuyện trò</a>
</li>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/su-kien-cong-nghe-offline/">Offline</a>
</li>
</ul>
</div>
<div class="clearFix"></div>
</div>

Click to expand...

Yêu bác qué , cám ơn bác nhìu nha :-*

onemylove · 21/6/14

votuonq said: ↑

thêm những cái sau vào EXTRA.CSS

chèn đoạn code sau vào trong thẻ <head> teamplate page_container, link thím tự sửa nhé

HTML:

<div class="LeftMenuFixed scroll-to-fixed-fixed" style="z-index: 999; position: fixed; top: 224px; margin-left: 0px; width: 172px; left: 34.5px;">
<div class="LeftMenu_wrp">
<ul class="lmn_bock01">
<span class="title_lmn1">
<a class="item_lmn" href="#">Chủ đề HOT</a>
</span>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/ios-iphone-ipad-ipod/">iOS</a>
</li>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/android/">Android</a>
</li>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/windows-phone/">Windows Phone</a>
</li>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/blackberry/">BlackBerry</a>
</li>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/laptop/">Laptop</a>
</li>
</ul>
<ul class="lmn_bock02">
<span class="title_lmn2">
<a class="item_lmn" href="#">Cộng đồng</a>
</span>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/danh-gia-trai-nghiem/">Đánh giá</a>
</li>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/chuyen-tro/">Chuyện trò</a>
</li>
<li>
<a class="item_lmn" href="http://congnghe.5giay.vn/forums/su-kien-cong-nghe-offline/">Offline</a>
</li>
</ul>
</div>
<div class="clearFix"></div>
</div>

Click to expand...

Làm sao để lúc kéo chuột xuống thì cái widget cuối cùng nó đi theo vậy bác , như cn5s á :

Cho HaTinh · 21/6/14

cái này tùy theme thì phải của mình làm mà nó ko hiện đc đẹp như vậy.

retkpop · 21/6/14

tớ làm được nke

asinvt · 21/6/14

cái vụ promoted topic cho cái block SLIDE này , để auto từ forum hay phải promoted thủ công vậy bạn ?

onemylove · 21/6/14

onemylove said: ↑

Làm sao để lúc kéo chuột xuống thì cái widget cuối cùng nó đi theo vậy bác , như cn5s á :
Click to expand...

UPPPPPPPPPPPPPPPPP

ngockhanh_bb · 21/6/14

nttruong said: ↑

Buồn quá! Viết bài share slide ở portal của trang congnghe.5giay.vn!

Nhưng làm chưa kịp! Tí up nhé. Cuối giờ trưa là có!

slide

Demo site: http://ytuonglamgiau.vn/ <<<<< rip nguyên style!

làm nhé!

tạo thêm 1 block là EWRblock_RecentNews1:
Thay toàn bộ code bằng:

Mã:

<xen:require css="message_user_info.css" />
<xen:require css="bb_code.css" />
<xen:require css="EWRblock_RecentNews1.css" />


<div class="feature-slider">
<div class="slide01">
<xen:foreach loop="$RecentNews1" value="$news" i="$i">
           <xen:if is="{$i} < 2">
        <div class="items1">
        <xen:if is="{$news.promote_icon} != 'disabled'">
                    <xen:if hascontent="true">
                        <xen:contentcheck>
                        <xen:if is="{$news.attach}">
                            <a href="{xen:link threads, $news}"><img src="{$news.attach.thumbnailUrl}" alt="{$news.attach.filename}" /></a>
                        <xen:elseif is="{$news.medio}" />
                            <div style="background: url('{xen:helper medio, $news.medio}') no-repeat;">
                                <a href="{xen:link 'full:media/popout', $news.medio}" class="OverlayTrigger"><img src="styles/8wayrun/EWRmedio_play.png" width="160" height="90" /></a>
                            </div>
                        <xen:elseif is="{$news.image}" />
                            <a href="{xen:link threads, $news}"><img src="{$news.image}" alt="{$news.image}" /></a>
                        <xen:else />
                            <xen:avatar user="$news" size="m" itemprop="photo" />
                        </xen:if>
                        </xen:contentcheck>
                    </xen:if>
                </xen:if>
             
                                      <span class="title"><a href="{xen:link threads, $news}">{$news.title}</a></span>
            </div>
             <xen:elseif is="{$i} < 4"/>
            <div class="items2">
                   <xen:if is="{$news.promote_icon} != 'disabled'">
                    <xen:if hascontent="true">
                        <xen:contentcheck>
                        <xen:if is="{$news.attach}">
                            <a href="{xen:link threads, $news}"><img src="{$news.attach.thumbnailUrl}" alt="{$news.attach.filename}" /></a>
                        <xen:elseif is="{$news.medio}" />
                            <div style="background: url('{xen:helper medio, $news.medio}') no-repeat;">
                                <a href="{xen:link 'full:media/popout', $news.medio}" class="OverlayTrigger"><img src="styles/8wayrun/EWRmedio_play.png" width="160" height="90" /></a>
                            </div>
                        <xen:elseif is="{$news.image}" />
                            <a href="{xen:link threads, $news}"><img src="{$news.image}" alt="{$news.image}" /></a>
                        <xen:else />
                            <xen:avatar user="$news" size="m" itemprop="photo" />
                        </xen:if>
                        </xen:contentcheck>
                    </xen:if>
                </xen:if>
                                     <span class="title"><a href="{xen:link threads, $news}">{$news.title}</a></span>
                </div>
                 <xen:elseif is="{$i} < 5"/>
                 </div>
                 <div class="slide02">            
            <div class="items3">
                <xen:if is="{$news.promote_icon} != 'disabled'">
                    <xen:if hascontent="true">
                        <xen:contentcheck>
                        <xen:if is="{$news.attach}">
                            <a href="{xen:link threads, $news}"><img src="{$news.attach.thumbnailUrl}" alt="{$news.attach.filename}" /></a>
                        <xen:elseif is="{$news.medio}" />
                            <div style="background: url('{xen:helper medio, $news.medio}') no-repeat;">
                                <a href="{xen:link 'full:media/popout', $news.medio}" class="OverlayTrigger"><img src="styles/8wayrun/EWRmedio_play.png" width="160" height="90" /></a>
                            </div>
                        <xen:elseif is="{$news.image}" />
                            <a href="{xen:link threads, $news}"><img src="{$news.image}" alt="{$news.image}" /></a>
                        <xen:else />
                            <xen:avatar user="$news" size="m" itemprop="photo" />
                        </xen:if>
                        </xen:contentcheck>
                    </xen:if>
                </xen:if>
                                      <span class="title"><a href="{xen:link threads, $news}">{$news.title}</a></span>
             </div>
             <xen:else />
             <div class="items3 items3_1">
              
<xen:if is="{$news.promote_icon} != 'disabled'">
<xen:if hascontent="true">
<xen:contentcheck>
<xen:if is="{$news.attach}">
<a href="{xen:link threads, $news}"><img src="{$news.attach.thumbnailUrl}" alt="{$news.attach.filename}" /></a>
<xen:elseif is="{$news.medio}" />
<div style="background: url('{xen:helper medio, $news.medio}') no-repeat;">
<a href="{xen:link 'full:media/popout', $news.medio}" class="OverlayTrigger"><img src="styles/8wayrun/EWRmedio_play.png" width="160" height="90" /></a>
</div>
<xen:elseif is="{$news.image}" />
<a href="{xen:link threads, $news}"><img src="{$news.image}" alt="{$news.image}" /></a>
<xen:else />
<xen:avatar user="$news" size="m" itemprop="photo" />
</xen:if>
</xen:contentcheck>
</xen:if>
</xen:if>
<span class="title"><a href="{xen:link threads, $news}">{$news.title}</a></span>
            </div>
            </div>
      </xen:if>
    </xen:foreach> 
     
 



   <div class="clear"></div>
</div>

- Mở template: EWRblock_RecentNews1.css. Thay toàn bộ bằng:

Mã:

.feature-slider:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}
#recentNews {
clear: both;
}

.items3_1 {
border-top: 1px solid #fff;
height: 199px;
}
.items3 {
position: absolute;
top: 0px;
left: 0px;
z-index: 3;
width: 290px;
height: 200px;
}
.feature-slider {
margin-top: 0px;
-webkit-box-shadow: 0 0 5px #b8b8b8;
-moz-box-shadow: 0 0 5px #b8b8b8;
-khtml-box-shadow: 0 0 5px #b8b8b8;
box-shadow: 0 0 5px #b8b8b8;
background: #fff;
float: left;
width: 690px;
height: 400px;
overflow: hidden;
margin-bottom: 20px;
}
.feature-slider .slide01, .feature-slider .slide02 {
float: left;
}
.feature-slider .slide01 {
width: 400px;
height: 400px;
padding: 0;
margin: 0;
position: relative;
}
.items1 {
position: absolute;
top: 0px;
left: 0px;
display: block;
z-index: 2;
border-right: 1px solid #fff;
width: 399px;
height: 250px;
}
.feature-slider .slide01 div {
position: relative;
overflow: hidden;
}
.items1 img {
min-width: 450px;
max-height: 250px;
}
.items1 .title {
width: 379px;
}
.feature-slider .title {
background: url(rgba.php?r=0&g=0&b=0&a=178);
background: rgba( 0,0,0,0.7);
_filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#B2000000,endColorstr=#B2000000);
position: absolute;
z-index: 100;
bottom: 0;
padding: 5px 10px;
overflow: hidden;
width: auto;
display: block;
width: auto;
}
.feature-slider .title a {
display: block;
height: 40px;
font-size: 13px;
font-weight: bold;
font-family: Arial, Helvetica, sans-serif;
text-shadow: 0 0 0 transparent, 0 0 2px #000;
line-height: 18px;
color: #fff;
text-decoration: none;
overflow: hidden;
}
.items2 {
top: 0px;
left: 0px;
z-index: 3;
width: 198px;
border-right: 1px solid #fff;
border-top: 1px solid #fff;
height: 149px;
float: left;
}
.items2 img {
min-width: 250px;
max-height: 150px;
}
.feature-slider .slide02 {
width: 290px;
height: 200px;
padding: 0;
margin: 0;
}
.feature-slider .slide02 div img {
min-width: 300px;
max-height: 200px;
overflow: hidden;
min-height: 200px;
}
.items3 .title {
width: 270px;
}
.clear {
clear: both;
}
.feature-slider .slide02 div {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
}
.items2 .title {
width: 180px;
}
.items1:hover .title, .items2:hover .title, .items3:hover .title {
background: url(rgba.php?r=0&g=138&b=192&a=229);
background: rgba( 0,138,192,0.9);
_filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#E5008AC0,endColorstr=#E5008AC0);
transition: all 0.8s ease 0s;
}
.items1 .title {
width: 379px;
}

Done nhé! Like mạnh, share mạnh! 8-x

Click to expand...

KLQ....Bác ở Bình Dương hay Bình Phươc vậy...:v

Other Share Slide của trang home website congnghe.5giay.vn/

nttruong Well-Known Member

Lê Tí Well-Known Member

onemylove Member

Lê Tí Well-Known Member

soulmasterbn Member

onemylove Member

namchelsea Member

Cho HaTinh Member

soulmasterbn Member

piggy001 Member

onemylove Member

onemylove Member

votuonq Member

onemylove Member

onemylove Member

Cho HaTinh Member

retkpop New Member

asinvt Member

onemylove Member

ngockhanh_bb Member

Chia sẻ trang này

Text Links

Textlink

Thông báo mới nhất