|
 |
| |
ช่วยดู CSS ให้หน่อยครับข้อใดต่อไปนี้ไม่ทำงานบน IE . . . . . . . |
| |
 |
|
|
 |
 |
|
OUTPUT คือ มันต้องเป็นรูปเสือน้อย 3 ภาพเลื่อนด้านซ้ายมาเรื่อยๆครับ
- chrome วิ่งได้ไม่มีปัญหา . . . แต่ IE กลายเป็นเสือสามภาพซ้อนแถวกันมาเลย ช่วยดูให้หน่อยครับ ว่า CSS ตัวไหนมันขาดตกบกพร่องไปบน IE
ปล. เอาใจ IE นี่มันช่างลำบากลำบนเหลือเกินไม่เหมือนชาวบ้านชาวช่องเค้า
โค้ดครับ copy ไปวางรันได้เลยช่วยหน่อยนะครับ ปัญหาติดตรงบน IE เท่านั้น 
Code (PHP)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!------------------------------------------------- JS --------------------------------------------------->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript">
jQuery(function($) {
var $gal = $('#gallery'),
$sli = $('#slider'),
$box = $('div',$sli),
W = $gal.width(), // 500
N = $box.length,
C = 0; // a counter
$sli.width(W*N);
//$('#prev, #next').click(function(){
$(function(){
C = (this.id=='next' ? ++C : --C) <0 ? N-1 : C%N;
$sli.stop().animate({left: -C*W },8000);
});
});
</script>
<!------------------------------------------------- CSS--------------------------------------------------->
<style type="text/css">
#gallery{
position:relative;
margin: 0 auto;
overflow:hidden;
width:500px;
height:278px;
}
#slider{
left:0;
position:absolute;
height:278px;
}
#slider > div {
position:relative;
float:left;
width:500px;
height:278px;
}
#slider > div img{
width:100%;
}
/* buttons */
#gallery > span{
bottom:0;
cursor:pointer;
position:absolute;
width:100%;
height:20%;
background:rgba(255,255,255,0.5);
opacity:0.5;
}
#next{
right:0px;
}
#gallery > span:hover{
opacity:1;
}
</style>
<!------------------------------------------------- HTML--------------------------------------------------->
<div id="gallery">
<div id="slider">
<div><img src="http://s2.postimg.org/5uxqi0mgl/cats1.jpg" alt=""></div>
<div><img src="http://s2.postimg.org/5uxqi0mgl/cats1.jpg" alt=""></div>
<div><img src="http://s2.postimg.org/5uxqi0mgl/cats1.jpg" alt=""></div>
</div>
<span id="next">xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</span>
</div>
Tag : PHP, HTML/CSS
|
ประวัติการแก้ไข
2014-01-28 04:08:38
|
 |
 |
 |
 |
| Date :
2014-01-28 04:06:54 |
By :
meannerss |
View :
634 |
Reply :
3 |
|
 |
 |
 |
 |
|
|
|
|
 |
 |
|
 |
 |
| |
|
|
|
| |
|
IE ไม่ได้เอาใจยากแต่เพราะผู้เขียนประสบการณ์ยังอ่อน 
|
| |
|
|
| |
| Date :
2014-01-28 08:13:12 |
By :
date |
|
|
| |
|
|
|
|
|
| |
|
|
|
|
|
| |
|
 Load balance : Server 05
|
