โมปุ่ม to top ขึ้นไปแบบมีสไตล์
แก้ไขครั้งสุดท้ายโดย jameiiz เมื่อ 2013-6-17 23:02ฮัลโหลเว็บมาสเตอร์
คือการทำปุ่มขึ้นไปด้านบนนี้ ผมได้ทดลองมาก่อนหน้าแ้ล้ว ผมคาดว่าปลอดภัยครับ
** แต่ควรสำรองไฟล์ไว้ก่อนด้วยนะครับ
1. ให้เพิ่มโค้ดเหล่านี้ เข้าไปในไฟล์ footer ในโฟลเดอร์สกินของเรา<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
** ที่ต้องใช้รูปเพราะโค้ดนี้มีปัญหาเรื่อง เวลาโพสมันจะเหลือแค่ <link rel="stylesheet" ><script>
$(document).ready(function(){
// hide #back-top first
$("#back-top").hide();
// fade in #back-top
$(function () {
$(window).scroll(function () {
if ($(this).scrollTop() > 100) {
$('#back-top').fadeIn();
} else {
$('#back-top').fadeOut();
}
});
// scroll body to 0px on click
$('#back-top a').click(function () {
$('body,html').animate({
scrollTop: 0
}, 800);
return false;
});
});
});
</script>
จะได้ประมาณนี้
2. เปลี่ยนโค้ด div
เปลี่ยนจาก<div id="scrolltop">
<!--{if $_G && $_G['mod'] == 'viewthread'}-->
<span><a href="forum.php?mod=post&action=reply&fid=$_G&tid=$_G&extra=$_GET&page=$page{if $_GET}&from=$_GET{/if}" onclick="showWindow('reply', this.href)" class="replyfast" title="{lang fastreply}"><b>{lang fastreply}</b></a></span>
<!--{/if}-->
<span hidefocus="true"><a title="{lang scrolltop}" onclick="window.scrollTo('0','0')" class="scrolltopa" ><b>{lang scrolltop}</b></a></span>
<!--{if $_G}-->
<span>
<!--{if $_G['mod'] == 'viewthread'}-->
<a href="forum.php?mod=forumdisplay&fid=$_G" hidefocus="true" class="returnlist" title="{lang return_list}"><b>{lang return_list}</b></a>
<!--{else}-->
<a href="forum.php" hidefocus="true" class="returnboard" title="{lang return_forum}"><b>{lang return_forum}</b></a>
<!--{/if}-->
</span>
<!--{/if}-->
</div>ให้เป็น<div id="pagewrap">
<p id="back-top">
<a href="#top"><span></span></a>
</p>
</div>3. เซฟไฟล์ แล้วอัพขึ้นโฮสทับไฟล์เก่าได้เลยครับ
ขอบคุณมากครับsm917dz ไม่เปลี่ยนรูปเอาอ่ะครับ sm910dz แก้ไขครั้งสุดท้ายโดย jameiiz เมื่อ 2013-6-17 19:03
กรณีที่อยากให้รูปเป็นเหมือนเดิม ดาวโหลดไฟล์ top.css ไปแก้ไขนะครับ
ดาวโหลด
แล้วแก้ไขที่บรรทัดที่ 43 และ 51 นะครับ เปลี่ยนให้เป็น ../../static/image/common/scrolltop.png หรือไฟล์รูปภาพของคุณครับ
หน้า:
[1]