|
|
|
รบกวนผู้รู้ ขอตัวอย่าง script ตัวหนังสือกระพริบหน่อยนะ กับการไล่สีนะครับ |
|
|
|
|
|
|
|
พอดีผมลองหาๆดูใน net เจอแต่ที่ ซัพพอต ie กับ firefox ไรพวกนี้อะครับ มีแบบ all browser ไหมเอ่ย
การไล่สีพอดีผมใช้สคิปตัวนี้นะครับ
Code (JavaScript)
window.addEventListener?window.addEventListener("load",createGradient,false):window.attachEvent("onload",createGradient);
function createGradient() {
if(!document.getElementById)return;
objArray = getGradientObjects();
if(!objArray.length) return;
for(i=0;i<objArray.length;i++) {
params = objArray[i].className.split(" ");
if(document.all && !window.opera) {
objArray[i].style.width = objArray[i].offsetWidth + "px";
params[3] == "horizontal"?gType = 1:gType = 0;
objArray[i].style.filter = "progid:DXImageTransform.Microsoft.Gradient(GradientType="+gType+",StartColorStr=\"#" + params[1] + "\",EndColorStr=\"#" + params[2] + "\")";
} else {
colorArray = createColorPath(params[1],params[2]);
x=0;y=0;
if(params[3] == "horizontal") {
w=Math.round(objArray[i].offsetWidth/colorArray.length);
if(!w)w=1;
h = objArray[i].offsetHeight;
} else {
h = Math.round(objArray[i].offsetHeight/colorArray.length);
if(!h) h =1;
w = objArray[i].offsetWidth;
}
makeGrandParent(objArray[i]);
tmpDOM = document.createDocumentFragment();
for(p=0;p<colorArray.length;p++) {
g = document.createElement("div");
g.setAttribute("style","position:absolute;z-index:0;top:" + y + "px;left:" + x + "px;height:" + h + "px;width:" + w + "px;background-color:rgb(" + colorArray[p][0] + "," + colorArray[p][1] + "," + colorArray[p][2] + ");");
params[3] == "horizontal"?x+=w:y+=h;
tmpDOM.appendChild(g);
if(y>=objArray[i].offsetHeight || x >= objArray[i].offsetWidth) break;
}
objArray[i].appendChild(tmpDOM);
tmpDOM = null;
}
}
}
function getGradientObjects() {
a = document.getElementsByTagName("*");
objs = new Array();
for(i=0;i<a.length;i++) {
c = a[i].className;
if(c != "") if(c.indexOf("gradient") == 0) objs[objs.length] = a[i];
}
return objs;
}
function createColorPath(color1,color2) {
colorPath = new Array();
colorPercent = 1.0;
do {
colorPath[colorPath.length]=setColorHue(longHexToDec(color1),colorPercent,longHexToDec(color2));
colorPercent-=.01;
} while(colorPercent>0);
return colorPath;
}
function setColorHue(originColor,opacityPercent,maskRGB) {
returnColor=new Array();
for(w=0;w<originColor.length;w++) returnColor[w] = Math.round(originColor[w]*opacityPercent) + Math.round(maskRGB[w]*(1.0-opacityPercent));
return returnColor;
}
function longHexToDec(longHex) {
return new Array(toDec(longHex.substring(0,2)),toDec(longHex.substring(2,4)),toDec(longHex.substring(4,6)));
}
function toDec(hex) {
return parseInt(hex,16);
}
function makeGrandParent(obj) {
disp = document.defaultView.getComputedStyle(obj,'').display;
disp == "block"?nSpan = document.createElement("div"): nSpan = document.createElement("span");
mHTML = obj.innerHTML;
obj.innerHTML = "";
nSpan.innerHTML = mHTML;
nSpan.setAttribute("style","position:relative;z-index:10;");
obj.appendChild(nSpan);
}
แล้วเกิดปัญหาสองประเด็น พอเอาไปปรับใช้กับ ข้อความเลื่อน ถ้าข้อความเลื่อนยาวไป จะมีแถบสีขาวเกิดขึ้นตรงจุดเริ่มต้น เกิดขึ้นกับ chrome ส่วน ie firefox ไม่มีปัญหาครับ
ส่วนอีกประเด็นคือ นำไปใช้กับ firefox แล้ว แถบไม่ขึ้นยังที่กำหนด ดันไปขึ้นมุมซ้ายบนสุด ส่วน chrome ie ไม่มีปัญหาครับ
T-T
Tag : MySQL
|
|
|
|
|
|
Date :
2011-08-02 09:05:38 |
By :
MermaidMelody |
View :
2474 |
Reply :
0 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Load balance : Server 00
|