글 수 109
0
조회 수 : 8247 신고 : 0
미리보기 : |
---|
이 자료는 블루비에서 얻어온 자료입니다^^
<html>
<head>
<title>뉴스티커 기능</title>
<style>
#so_oTickerContainer {
width:500px;
margin:auto;
font:verdana,arial;
background-color:lightyellow;
border-top:1px solid yellow;
border-bottom:1px solid yellow;
}
#so_oTickerContainer h1 {
font:bold verdana,arial;
margin:0;
padding:0;
}
.so_tickerContainer {
position:relative;
margin:auto;
width:500px;
background-color:lightyellow;
border-top:1px solid yellow;
border-bottom:1px solid yellow;
}
#so_tickerAnchor, #so_oTickerContainer a {
text-decoration:none;
color:black;
font:bold arial,verdana;
border-right:1px solid #000;
padding-right:2px;
}
#so_oTickerContainer a {
border-style:none;
}
#so_oTickerContainer ul {
margin-top:5px;
}
#so_tickerDiv {
display:inline;
margin-left:5px;
}
#so_tickerH1 {
font:bold 1.0em arial,verdana;
display:inline;
}
#so_tickerH1 a {
text-decoration:none;
color:#000;
padding-right:2px;
}
#so_tickerH1 a img {
border-style:none;
}
</style>
<script>
/* This script and many more are available free online at
The JavaScript Source!! http://javascript.internet.com
Created by: Steve Chipman | http://slayeroffice.com/Licensed under: Creative Commons License
*/
/****************************
so_ticker
version 1.0
last revision: 03.30.2006
steve@slayeroffice.com
For implementation instructions, see:
http://slayeroffice.com/code/so_ticker/
Should you improve upon or modify this
code, please let me know so that I can update
the version hosted at slayeroffice.
Please leave this notice intact.
****************************/
so_ticker = new Object();
so_ticker = {
current:0,
currentLetter:0,
zInterval:null,
tObj: null,
op:0.95,
pause: false,
tickerContent: [],
LETTER_TICK:100,
FADE: 10,
NEXT_ITEM_TICK: 3000,
init:function() {
var d=document;
var mObj = d.getElementById("so_oTickerContainer");
so_ticker.tObj = d.createElement("div");
so_ticker.tObj.setAttribute("id","so_tickerDiv");
var h = d.createElement("h1");
h.appendChild(d.createTextNode(so_ticker.getTextNodeValues(mObj.getElementsByTagName("h1")[0])));
h.setAttribute("id","so_tickerH1");
var ea = d.createElement("a");
ea.setAttribute("href","javascript:so_ticker.showContent();");
pImg = ea.appendChild(document.createElement("img"));
pImg.setAttribute("src","http://www.blueb.co.kr/SRC/javascript/image6/arrow_image2.gif");
pImg.setAttribute("alt","Click to View all News Items.");
ea.setAttribute("title","Click to View all News Items.");
h.insertBefore(ea,h.firstChild);
anchors = mObj.getElementsByTagName("a");
var nObj = mObj.cloneNode(false);
mObj.parentNode.insertBefore(nObj,mObj);
mObj.style.display = "none";
nObj.className = "so_tickerContainer";
nObj.setAttribute("id","so_nTickerContainer");
nObj.appendChild(h);
nObj.appendChild(so_ticker.tObj);
so_ticker.getTickerContent();
so_ticker.zInterval = setInterval(so_ticker.tick,so_ticker.LETTER_TICK);
},
showContent:function() {
var d = document;
d.getElementById("so_oTickerContainer").style.display = "block";
d.getElementById("so_nTickerContainer").style.display = "none";
d.getElementById("so_oTickerContainer").getElementsByTagName("a")[0].focus();
clearInterval(so_ticker.zInterval);
},
getTickerContent:function() {
for(var i=0;i<anchors.length;i++) so_ticker.tickerContent[i] = so_ticker.getTextNodeValues(anchors[i]);
},
getTextNodeValues:function(obj) {
if(obj.textContent) return obj.textContent;
if (obj.nodeType == 3) return obj.data;
var txt = [], i=0;
while(obj.childNodes[i]) {
txt[txt.length] = so_ticker.getTextNodeValues(obj.childNodes[i]);
i++;
}
return txt.join("");
},
tick: function() {
var d = document;
if(so_ticker.pause) {
try {
so_ticker.clearContents(d.getElementById("so_tickerAnchor"));
d.getElementById("so_tickerAnchor").appendChild(d.createTextNode(so_ticker.tickerContent[so_ticker.current]));
so_ticker.currentLetter = so_ticker.tickerContent[so_ticker.current].length;
} catch(err) { }
return;
}
if(!d.getElementById("so_tickerAnchor")) {
var aObj = so_ticker.tObj.appendChild(d.createElement("a"));
aObj.setAttribute("id","so_tickerAnchor");
aObj.setAttribute("href",anchors[so_ticker.current].getAttribute("href"));
aObj.onmouseover = function() { so_ticker.pause = true; }
aObj.onmouseout = function() { so_ticker.pause = false; }
aObj.onfocus = aObj.onmouseover;
aObj.onblur = aObj.onmouseout;
aObj.setAttribute("title",so_ticker.tickerContent[so_ticker.current]);
}
d.getElementById("so_tickerAnchor").appendChild(d.createTextNode(so_ticker.tickerContent[so_ticker.current].charAt(so_ticker.currentLetter)));
so_ticker.currentLetter++;
if(so_ticker.currentLetter > so_ticker.tickerContent[so_ticker.current].length) {
clearInterval(so_ticker.zInterval);
setTimeout(so_ticker.initNext,so_ticker.NEXT_ITEM_TICK);
}
},
fadeOut: function() {
if(so_ticker.paused) return;
so_ticker.setOpacity(so_ticker.op,so_ticker.tObj);
so_ticker.op-=.10;
if(so_ticker.op<0) {
clearInterval(so_ticker.zInterval);
so_ticker.clearContents(so_ticker.tObj);
so_ticker.setOpacity(.95,so_ticker.tObj);
so_ticker.op = .95;
so_ticker.zInterval = setInterval(so_ticker.tick,so_ticker.LETTER_TICK);
}
},
initNext:function() {
so_ticker.currentLetter = 0, d = document;
so_ticker.current = so_ticker.tickerContent[so_ticker.current + 1]?so_ticker.current+1:0;
d.getElementById("so_tickerAnchor").setAttribute("href",anchors[so_ticker.current].getAttribute("href"));
d.getElementById("so_tickerAnchor").setAttribute("title",so_ticker.tickerContent[so_ticker.current]);
so_ticker.zInterval = setInterval(so_ticker.fadeOut,so_ticker.FADE);
},
setOpacity:function(opValue,obj) {
obj.style.opacity = opValue;
obj.style.MozOpacity = opValue;
obj.style.filter = "alpha(opacity=" + (opValue*100) + ")";
},
clearContents:function(obj) {
try {
while(obj.firstChild) obj.removeChild(obj.firstChild);
} catch(err) { }
}
}
function page_init(){
so_ticker.init();
}
window.addEventListener?window.addEventListener("load",page_init,false):window.attachEvent("onload",page_init);
</script>
</head>
<body>
<div id="so_oTickerContainer">
<h1>Latest News:</h1>
<ul>
<li><a href="http://www.blueb.co.kr">안녕하세요. 블루비에 오신것을 환영합니다.</a></li>
<li><a href="http://www.blueb.co.kr">블루비는 웹개발자들을 위한 공간입니다.</a></li>
<li><a href="http://www.blueb.co.kr">자료만 보시고 훌쩍 떠나는 유령은 반성하세요..</a></li>
<li><a href="http://www.blueb.co.kr">감사합니다.</a></li>
</ul>
</div>
</body>
</html>
<head>
<title>뉴스티커 기능</title>
<style>
#so_oTickerContainer {
width:500px;
margin:auto;
font:verdana,arial;
background-color:lightyellow;
border-top:1px solid yellow;
border-bottom:1px solid yellow;
}
#so_oTickerContainer h1 {
font:bold verdana,arial;
margin:0;
padding:0;
}
.so_tickerContainer {
position:relative;
margin:auto;
width:500px;
background-color:lightyellow;
border-top:1px solid yellow;
border-bottom:1px solid yellow;
}
#so_tickerAnchor, #so_oTickerContainer a {
text-decoration:none;
color:black;
font:bold arial,verdana;
border-right:1px solid #000;
padding-right:2px;
}
#so_oTickerContainer a {
border-style:none;
}
#so_oTickerContainer ul {
margin-top:5px;
}
#so_tickerDiv {
display:inline;
margin-left:5px;
}
#so_tickerH1 {
font:bold 1.0em arial,verdana;
display:inline;
}
#so_tickerH1 a {
text-decoration:none;
color:#000;
padding-right:2px;
}
#so_tickerH1 a img {
border-style:none;
}
</style>
<script>
/* This script and many more are available free online at
The JavaScript Source!! http://javascript.internet.com
Created by: Steve Chipman | http://slayeroffice.com/Licensed under: Creative Commons License
*/
/****************************
so_ticker
version 1.0
last revision: 03.30.2006
steve@slayeroffice.com
For implementation instructions, see:
http://slayeroffice.com/code/so_ticker/
Should you improve upon or modify this
code, please let me know so that I can update
the version hosted at slayeroffice.
Please leave this notice intact.
****************************/
so_ticker = new Object();
so_ticker = {
current:0,
currentLetter:0,
zInterval:null,
tObj: null,
op:0.95,
pause: false,
tickerContent: [],
LETTER_TICK:100,
FADE: 10,
NEXT_ITEM_TICK: 3000,
init:function() {
var d=document;
var mObj = d.getElementById("so_oTickerContainer");
so_ticker.tObj = d.createElement("div");
so_ticker.tObj.setAttribute("id","so_tickerDiv");
var h = d.createElement("h1");
h.appendChild(d.createTextNode(so_ticker.getTextNodeValues(mObj.getElementsByTagName("h1")[0])));
h.setAttribute("id","so_tickerH1");
var ea = d.createElement("a");
ea.setAttribute("href","javascript:so_ticker.showContent();");
pImg = ea.appendChild(document.createElement("img"));
pImg.setAttribute("src","http://www.blueb.co.kr/SRC/javascript/image6/arrow_image2.gif");
pImg.setAttribute("alt","Click to View all News Items.");
ea.setAttribute("title","Click to View all News Items.");
h.insertBefore(ea,h.firstChild);
anchors = mObj.getElementsByTagName("a");
var nObj = mObj.cloneNode(false);
mObj.parentNode.insertBefore(nObj,mObj);
mObj.style.display = "none";
nObj.className = "so_tickerContainer";
nObj.setAttribute("id","so_nTickerContainer");
nObj.appendChild(h);
nObj.appendChild(so_ticker.tObj);
so_ticker.getTickerContent();
so_ticker.zInterval = setInterval(so_ticker.tick,so_ticker.LETTER_TICK);
},
showContent:function() {
var d = document;
d.getElementById("so_oTickerContainer").style.display = "block";
d.getElementById("so_nTickerContainer").style.display = "none";
d.getElementById("so_oTickerContainer").getElementsByTagName("a")[0].focus();
clearInterval(so_ticker.zInterval);
},
getTickerContent:function() {
for(var i=0;i<anchors.length;i++) so_ticker.tickerContent[i] = so_ticker.getTextNodeValues(anchors[i]);
},
getTextNodeValues:function(obj) {
if(obj.textContent) return obj.textContent;
if (obj.nodeType == 3) return obj.data;
var txt = [], i=0;
while(obj.childNodes[i]) {
txt[txt.length] = so_ticker.getTextNodeValues(obj.childNodes[i]);
i++;
}
return txt.join("");
},
tick: function() {
var d = document;
if(so_ticker.pause) {
try {
so_ticker.clearContents(d.getElementById("so_tickerAnchor"));
d.getElementById("so_tickerAnchor").appendChild(d.createTextNode(so_ticker.tickerContent[so_ticker.current]));
so_ticker.currentLetter = so_ticker.tickerContent[so_ticker.current].length;
} catch(err) { }
return;
}
if(!d.getElementById("so_tickerAnchor")) {
var aObj = so_ticker.tObj.appendChild(d.createElement("a"));
aObj.setAttribute("id","so_tickerAnchor");
aObj.setAttribute("href",anchors[so_ticker.current].getAttribute("href"));
aObj.onmouseover = function() { so_ticker.pause = true; }
aObj.onmouseout = function() { so_ticker.pause = false; }
aObj.onfocus = aObj.onmouseover;
aObj.onblur = aObj.onmouseout;
aObj.setAttribute("title",so_ticker.tickerContent[so_ticker.current]);
}
d.getElementById("so_tickerAnchor").appendChild(d.createTextNode(so_ticker.tickerContent[so_ticker.current].charAt(so_ticker.currentLetter)));
so_ticker.currentLetter++;
if(so_ticker.currentLetter > so_ticker.tickerContent[so_ticker.current].length) {
clearInterval(so_ticker.zInterval);
setTimeout(so_ticker.initNext,so_ticker.NEXT_ITEM_TICK);
}
},
fadeOut: function() {
if(so_ticker.paused) return;
so_ticker.setOpacity(so_ticker.op,so_ticker.tObj);
so_ticker.op-=.10;
if(so_ticker.op<0) {
clearInterval(so_ticker.zInterval);
so_ticker.clearContents(so_ticker.tObj);
so_ticker.setOpacity(.95,so_ticker.tObj);
so_ticker.op = .95;
so_ticker.zInterval = setInterval(so_ticker.tick,so_ticker.LETTER_TICK);
}
},
initNext:function() {
so_ticker.currentLetter = 0, d = document;
so_ticker.current = so_ticker.tickerContent[so_ticker.current + 1]?so_ticker.current+1:0;
d.getElementById("so_tickerAnchor").setAttribute("href",anchors[so_ticker.current].getAttribute("href"));
d.getElementById("so_tickerAnchor").setAttribute("title",so_ticker.tickerContent[so_ticker.current]);
so_ticker.zInterval = setInterval(so_ticker.fadeOut,so_ticker.FADE);
},
setOpacity:function(opValue,obj) {
obj.style.opacity = opValue;
obj.style.MozOpacity = opValue;
obj.style.filter = "alpha(opacity=" + (opValue*100) + ")";
},
clearContents:function(obj) {
try {
while(obj.firstChild) obj.removeChild(obj.firstChild);
} catch(err) { }
}
}
function page_init(){
so_ticker.init();
}
window.addEventListener?window.addEventListener("load",page_init,false):window.attachEvent("onload",page_init);
</script>
</head>
<body>
<div id="so_oTickerContainer">
<h1>Latest News:</h1>
<ul>
<li><a href="http://www.blueb.co.kr">안녕하세요. 블루비에 오신것을 환영합니다.</a></li>
<li><a href="http://www.blueb.co.kr">블루비는 웹개발자들을 위한 공간입니다.</a></li>
<li><a href="http://www.blueb.co.kr">자료만 보시고 훌쩍 떠나는 유령은 반성하세요..</a></li>
<li><a href="http://www.blueb.co.kr">감사합니다.</a></li>
</ul>
</div>
</body>
</html>
소중한 댓글 부탁드립니다.
추천수 10단위당 메달이 1개씩 노출되고, 추천수에 따라 배경색이 변하며, 일정수의 추천수를 받을시 아이콘이 붙게됩니다.
추천수 10단위당 메달이 1개씩 노출되고, 추천수에 따라 배경색이 변하며, 일정수의 추천수를 받을시 아이콘이 붙게됩니다.
추천수에 따른 배경색 보기
본문으로 바로가기
- 추천수 50개이상
- 추천수 30개이상
- 추천수 20개이상
- 추천수 10개이상
- 추천수 3개이상