What are the benefits of this:
- No iframes
- Less bandwidth usage for my site
- Quicker loading and uses less of MFL's resources
- Easier to implement for the end user
You can see it in action here: http://www8.myfantas...2008/home/15372
The first few lines of the code have variables that you can change but are not required to.
A little further down is a CSS section where you can add some customization if you want.
Just copy and paste the code into a home page module
Here is the code for those interested:
Last modified: September 9, 2011
<script language="JavaScript" type="text/javascript">
<!--
// FYI: Last updated August 28, 2008
//Start boxscore manually
var boxClickToStart = false;
//For sites that are Fixed Width set the width here
var boxFixedWidthSite = 0;
//For sites where the calculated vertical positioning is not working
//you can set your own fixed positioning
//Simply uncomment the following var (remove the leading slashes) and set the number to fit your site
// var boxVerticalOverride = 200;
//Number of Rows desired to display boxscores
var boxRows = 1;
//If you wish to use icons from previous iframe box
var useOldBoxIconMethod = false;
//Icon URL including base name and extension
var boxIconURL = '';
var boxIconExt = 'gif';
//Use league icons as default images
var boxIconLeagueDefault = false;
//Use league logos as default images
var boxLogoLeagueDefault = false;
//Day of week to switch from Last Weeks Results to Next Weeks Games
var boxSwitchDay = 3; // 3 is Wednesday; 4 is Thursday
//Set the number of decimal places
var boxDecimals = 0;
//Hide ties when displaying (W-L-T)
var hideTiesInRecord = false;
//Hide spread in upcoming games
var hideSpread = false;
//Hide Box Tip
var hideBoxTip = false;
//Display boxscores on home page only (useful if boxscore is in header)
var boxHomeOnly = true;
//Franchise Name or Nickname display
var hideName = false;
var useNickNames = false;
//Set up your Nick names here if you choose to use them
var franchiseNickNames = new Object();
franchiseNickNames['0001'] = 'NICK 1';
franchiseNickNames['0002'] = 'NICK 2';
franchiseNickNames['0003'] = 'NICK 3';
franchiseNickNames['0004'] = 'NICK 4 ';
// .
// .
// etc.
//-->
</script>
<style type='text/css'>
.boxtablerow {
background-color: #E8E1D1;
color: black;
}
.boxoutertable {
border-collapse: collapse;
width: 100%;
padding: 0px;
margin: 0px;
align: center;
background-color: #E8E1D1;
}
.boxoutertd {
border: 1px solid black;
}
.boxinnertable {
border-collapse: collapse;
width: 100%;
padding: 0px;
margin: 0px;
}
a.boxclock:link, a.boxclock:visited, a.boxclock:active {
text-decoration: none;
color: black;
font-style: italic;
}
a.boxclock:hover {
text-decoration: none;
color: red;
}
.boxteam {
margin: 0px;
padding: 0px;
}
.boxscore {
font-size: 15px;
font-weight: bold;
margin: 0px;
padding: 0px;
}
.boxclock {
margin: 0px;
padding: 0px;
}
.boxicon {
height: 30px; /* Use #px for fixed width i.e. 100px */
width: 30px;
}
.boxspread {
font-size: 14px;
color: red;
}
.tipbox {
border: 2px solid black;
color: black;
background-color: lightyellow;
padding: 4px;
}
</style>
<script language="JavaScript" type="text/javascript" src="http://www.habman.com/mfl/apps/js/habman_common.js"></script>
<script language="JavaScript" type="text/javascript" src="http://www.habman.com/mfl/apps/js/boxscore.js"></script>Here is a brief tutorial on how to implement the images.
There are three ways to do this:
Method #1
If you have icons already setup for your league then just set boxIconLeagueDefault to true
OR
If you have logos already setup for your league the just set boxLogoLeagueDefault to true
======================================
Method #2
If you have icons already made on a personal site from the old iframe ticker then set useOldIconMethod to true and update the iconURL and iconExt as you did for the iframe ticker.
======================================
Method #3
If you wish to create icons for this ticker from scratch then here is how you would do that.
First create your icons but note that they must be of the same file type. ie gif or bmp or jpg
Next choose a base name for your icons ie. icon or image or franchise
Now assuming you chose the base name "icon" name your icons in the following manner: icon0001, icon0002 etc. for franchise #1, franchise #2 etc.
Upload your icons to a personal site for example mine are located at www.habman.com/images/
Now in the script you would set iconURL = 'http://www.habman.com/images/icon';
Lastly in the script you would set the icon extension iconExt = 'gif'; if they are in the gif format.
That is all.
If you have any questions or issues just ask.
UPDATES
Update November 10th:
Added ability to automatically set the days of the week for the Click to Start option.
Replace:
var boxClickToStart = false;with
var boxClickToStart = new Array(false,false,true,true,true,true,true);In the above example the boxscore will display normally on Sunday & Monday and use the "Click to Start" for the other days.
Update September 9, 2011:
Many sites are now using "Fixed Width" which messes up the popups positioning. I have added a var "boxFixedWidthSite" which will compensate for fixed width sites.
Simply set the var to the width of your fixed width site ie
var boxFixedWidthSite = 980;
Just leave it set to zero or omit it altogether if your site is not fixed width.
Update September 10, 2011:
The vertical positioning of the popup gets calculated wrong on some sites so I have added the ability to manually set the vertical positioning.
It may take some trial and error on your part to get the positioning set correctly.
Example: To set the positioning at 200 pixels from the top here is the code
var boxVerticalOverride = 200;
