I am wondering if somebody can help me out with creating a new block code.
I would like to add a little block that has scrolling information for our local area. I believe I would be able to enter the details but the actual code itself is what I would like some help with.
I guess I would want it to look like the arcade champions scrolling block. At the top, it would have the image I have included of the gas pump with text saying "Western Slope Gas Prices". Then the information that would scroll would have the date, location, and price of gas. I would like to enter multiple locations and stuff so where the text gets entered would have to be pretty easy.
Does anybody have any ideas about this?
[attachment deleted by admin]
This is what I have so far. It's a pausing scroller. For some reason, the background color doesn't change to the themes color but remains white.
<script type="text/javascript">
/***********************************************
* Pausing updown message scroller- ÂÃ,© Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
//configure the below five variables to change the style of the scroller
var scrollerdelay='3000' //delay between msg scrolls. 3000=3 seconds.
var scrollerwidth='105px'
var scrollerheight='105px'
var scrollerbgcolor='lightyellow'
//set below to '' if you don't wish to use a background image
var scrollerbackground='scrollerback.gif'
//configure the below variable to change the contents of the scroller
var messages=new Array()
messages[0]="<font face='Arial'><a href='http://www.westernslopeanglers.com/index.php/topic,1636.new.html#new'>Loco - 29 Road and Patterson - $2.19 per gallon</a></font>"
messages[1]="<font face='Arial'><a href='http://www.westernslopeanglers.com/index.php/topic,1636.new.html#new'>Sinclair - 25 1/2 Road and Patterson - $2.05 per gallon</a></font>"
messages[2]="<font face='Arial'><a href='http://www.westernslopeanglers.com/index.php/topic,1636.new.html#new'>Test</a></font>"
messages[3]="<font face='Arial'><a href='http://www.westernslopeanglers.com/index.php/topic,1636.new.html#new'>Test</a></font>"
messages[4]="<font face='Arial'><a href='http://www.westernslopeanglers.com/index.php/topic,1636.new.html#new'>Test</a></font>"
///////Do not edit pass this line///////////////////////
var ie=document.all
var dom=document.getElementById
if (messages.length>2)
i=2
else
i=0
function move(whichdiv){
tdiv=eval(whichdiv)
if (parseInt(tdiv.style.top)>0&&parseInt(tdiv.style.top)<=5){
tdiv.style.top=0+"px"
setTimeout("move(tdiv)",scrollerdelay)
setTimeout("move2(second2_obj)",scrollerdelay)
return
}
if (parseInt(tdiv.style.top)>=tdiv.offsetHeight*-1){
tdiv.style.top=parseInt(tdiv.style.top)-5+"px"
setTimeout("move(tdiv)",50)
}
else{
tdiv.style.top=parseInt(scrollerheight)+"px"
tdiv.innerHTML=messages[i]
if (i==messages.length-1)
i=0
else
i++
}
}
function move2(whichdiv){
tdiv2=eval(whichdiv)
if (parseInt(tdiv2.style.top)>0&&parseInt(tdiv2.style.top)<=5){
tdiv2.style.top=0+"px"
setTimeout("move2(tdiv2)",scrollerdelay)
setTimeout("move(first2_obj)",scrollerdelay)
return
}
if (parseInt(tdiv2.style.top)>=tdiv2.offsetHeight*-1){
tdiv2.style.top=parseInt(tdiv2.style.top)-5+"px"
setTimeout("move2(second2_obj)",50)
}
else{
tdiv2.style.top=parseInt(scrollerheight)+"px"
tdiv2.innerHTML=messages[i]
if (i==messages.length-1)
i=0
else
i++
}
}
function startscroll(){
first2_obj=ie? first2 : document.getElementById("first2")
second2_obj=ie? second2 : document.getElementById("second2")
move(first2_obj)
second2_obj.style.top=scrollerheight
second2_obj.style.visibility='visible'
}
if (ie||dom){
document.writeln('<div id="main2" style="position:relative;width:'+scrollerwidth+';height:'+scrollerheight+';overflow:hidden;background-color:'+scrollerbgcolor+' ;background-image:url('+scrollerbackground+')">')
document.writeln('<div style="position:absolute;width:'+scrollerwidth+';height:'+scrollerheight+';clip:rect(0 '+scrollerwidth+' '+scrollerheight+' 0);left:0px;top:0px">')
document.writeln('<div id="first2" style="position:absolute;width:'+scrollerwidth+';left:0px;top:1px;">')
document.write(messages[0])
document.writeln('</div>')
document.writeln('<div id="second2" style="position:absolute;width:'+scrollerwidth+';left:0px;top:0px;visibility:hidden">')
document.write(messages[dyndetermine=(messages.length==1)? 0 : 1])
document.writeln('</div>')
document.writeln('</div>')
document.writeln('</div>')
}
if (window.addEventListener)
window.addEventListener("load", startscroll, false)
else if (window.attachEvent)
window.attachEvent("onload", startscroll)
else if (ie||dom)
window.onload=startscroll
</script>
I don't know where to put that graphic at though.
could be the color right here:
Quotevar scrollerbgcolor='lightyellow'
//set below to '' if you don't wish to use a background image
var scrollerbackground='scrollerback.gif'
Don't use a image or color "transparent"
That's it. Color transparent. Thanks crip.
Alright. Got it working now. No graphic but that's ok.
Here is my complete code now.
Create an HTML block and then change it to a javascript/html box.
<script type="text/javascript">
/***********************************************
* Pausing updown message scroller- ÂÃ,© Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
//configure the below five variables to change the style of the scroller
var scrollerdelay='3000' //delay between msg scrolls. 3000=3 seconds.
var scrollerwidth='120px'
var scrollerheight='105px'
var scrollerbgcolor='transparent'
//set below to '' if you don't wish to use a background image
var scrollerbackground='scrollerback.gif'
//configure the below variable to change the contents of the scroller
var messages=new Array()
messages[0]="<font face='Tahoma'><a href='http://www.westernslopeanglers.com/index.php/topic,1636.new.html#new'>Loco - 29 Road and Patterson - $2.24 per gallon</a></font>"
messages[1]="<font face='Arial'><a href='http://www.westernslopeanglers.com/index.php/topic,1636.new.html#new'>Sinclair - 25 1/2 Road and Patterson - $2.15 per gallon</a></font>"
messages[2]="<font face='Arial'><a href='http://www.westernslopeanglers.com/index.php/topic,1636.new.html#new'>Care to share gas prices? Click to add</a></font>"
messages[3]="<font face='Arial'><a href='http://www.westernslopeanglers.com/index.php/topic,1636.new.html#new'>What did you pay for gas? Click to add</a></font>"
messages[4]="<font face='Arial'><a href='http://www.westernslopeanglers.com/index.php/topic,1636.new.html#new'>How much is gas around you? Click to add</a></font>"
messages[5]="<font face='Arial'><a href='http://www.westernslopeanglers.com/index.php/topic,1636.new.html#new'>Found Cheap Gas? Click Here</a></font>"
///////Do not edit pass this line///////////////////////
var ie=document.all
var dom=document.getElementById
if (messages.length>2)
i=2
else
i=0
function move(whichdiv){
tdiv=eval(whichdiv)
if (parseInt(tdiv.style.top)>0&&parseInt(tdiv.style.top)<=5){
tdiv.style.top=0+"px"
setTimeout("move(tdiv)",scrollerdelay)
setTimeout("move2(second2_obj)",scrollerdelay)
return
}
if (parseInt(tdiv.style.top)>=tdiv.offsetHeight*-1){
tdiv.style.top=parseInt(tdiv.style.top)-5+"px"
setTimeout("move(tdiv)",50)
}
else{
tdiv.style.top=parseInt(scrollerheight)+"px"
tdiv.innerHTML=messages[i]
if (i==messages.length-1)
i=0
else
i++
}
}
function move2(whichdiv){
tdiv2=eval(whichdiv)
if (parseInt(tdiv2.style.top)>0&&parseInt(tdiv2.style.top)<=5){
tdiv2.style.top=0+"px"
setTimeout("move2(tdiv2)",scrollerdelay)
setTimeout("move(first2_obj)",scrollerdelay)
return
}
if (parseInt(tdiv2.style.top)>=tdiv2.offsetHeight*-1){
tdiv2.style.top=parseInt(tdiv2.style.top)-5+"px"
setTimeout("move2(second2_obj)",50)
}
else{
tdiv2.style.top=parseInt(scrollerheight)+"px"
tdiv2.innerHTML=messages[i]
if (i==messages.length-1)
i=0
else
i++
}
}
function startscroll(){
first2_obj=ie? first2 : document.getElementById("first2")
second2_obj=ie? second2 : document.getElementById("second2")
move(first2_obj)
second2_obj.style.top=scrollerheight
second2_obj.style.visibility='visible'
}
if (ie||dom){
document.writeln('<div id="main2" style="position:relative;width:'+scrollerwidth+';height:'+scrollerheight+';overflow:hidden;background-color:'+scrollerbgcolor+' ;background-image:url('+scrollerbackground+')">')
document.writeln('<div style="position:absolute;width:'+scrollerwidth+';height:'+scrollerheight+';clip:rect(0 '+scrollerwidth+' '+scrollerheight+' 0);left:0px;top:0px">')
document.writeln('<div id="first2" style="position:absolute;width:'+scrollerwidth+';left:0px;top:1px;">')
document.write(messages[0])
document.writeln('</div>')
document.writeln('<div id="second2" style="position:absolute;width:'+scrollerwidth+';left:0px;top:0px;visibility:hidden">')
document.write(messages[dyndetermine=(messages.length==1)? 0 : 1])
document.writeln('</div>')
document.writeln('</div>')
document.writeln('</div>')
}
if (window.addEventListener)
window.addEventListener("load", startscroll, false)
else if (window.attachEvent)
window.attachEvent("onload", startscroll)
else if (ie||dom)
window.onload=startscroll
</script>
In order to change it to suit what you need, you will need to change this:
//configure the below variable to change the contents of the scroller
var messages=new Array()
messages[0]="<font face='Tahoma'><a href='http://www.westernslopeanglers.com/index.php/topic,1636.new.html#new'>Loco - 29 Road and Patterson - $2.24 per gallon</a></font>"
messages[1]="<font face='Arial'><a href='http://www.westernslopeanglers.com/index.php/topic,1636.new.html#new'>Sinclair - 25 1/2 Road and Patterson - $2.15 per gallon</a></font>"
messages[2]="<font face='Arial'><a href='http://www.westernslopeanglers.com/index.php/topic,1636.new.html#new'>Care to share gas prices? Click to add</a></font>"
messages[3]="<font face='Arial'><a href='http://www.westernslopeanglers.com/index.php/topic,1636.new.html#new'>What did you pay for gas? Click to add</a></font>"
messages[4]="<font face='Arial'><a href='http://www.westernslopeanglers.com/index.php/topic,1636.new.html#new'>How much is gas around you? Click to add</a></font>"
messages[5]="<font face='Arial'><a href='http://www.westernslopeanglers.com/index.php/topic,1636.new.html#new'>Found Cheap Gas? Click Here</a></font>"
Change the link and make sure you keep the ' in front and behind it and then after the > you can add your text. These are clickable links so you can direct them to go anywhere in your site or elsewhere.
messages[0]="<font face='Tahoma'><a href='http://www.your link.com'>Your text here</a></font>"
If you want to add more links, then just copy and paste this code below and change the number.
messages[0]="<font face='Tahoma'><a href='http://www.your link.com'>Your text here</a></font>"
messages[2]="<font face='Tahoma'><a href='http://www.your link.com'>Your text here</a></font>"
messages[423]="<font face='Tahoma'><a href='http://www.your link.com'>Your text here</a></font>"
You can view the demo here (http://westernslopeanglers.com).
It's on the right side bottom block.
Your sites looking really good WSA Nice work
;)installed- need to start getting up to date prices...cool- thanksAndy
www.cponygo.com/forums (http://www.cponygo.com/forums)