SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member
    Join Date
    Jun 2002
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Need help with a MakeOver

    Here is my website. http://www.krazyk9.com. It is devoted to sports contests. My buddy designed the site about 6 months ago, and during that time I've been trying to learn some web-based programming such as html, java, and a touch of php. So basically, I'm still a little fresh with all this but I can learn quick.

    Anyway, the problem that I don't like with my website is that it uses frames. I don't particularly like the use of the frameset with my webpage. BAsically, my main question is that if I were to get rid of the frameset, is there a way I could have my border (that purplish-pink border) preload its images so that if I were to use this border in a template, these images wouldn't have to load every time a user clicks on a link? Someone mentioned CSS possibly, but I wanted to verify this as being my best alternative.

    If you need further explanation, I will be glad to assist.

    Thanks for the help!!


  2. #2
    SitePoint Zealot yuri's Avatar
    Join Date
    Oct 2001
    Location
    Just Round The Corner!
    Posts
    166
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    indeed there is my good man. have a gander t this bit of code


    <html>

    <head>

    <script language="JavaScript1.2">

    <!-- begin hiding
    startingColor = new Array() // <-- Do not modify!
    endingColor = new Array() // <-- Do not modify!

    // YOU MAY MODIFY THE FOLLOWING:

    var yourImages = new Array(

    "http://home.quicknet.nl/qn/prive/r.vangeel/d4f/Images/Buttons/menu_home_over.gif",

    "the rest of the images",

    )

    var locationAfterPreload = "" // The script will redirect here when the preloading finishes *successfully*

    var preloadbarWidth = 400 // The length of the preload bar. Should be greater than total amount of images you want to preload!

    var preloadbarHeight = 15 // The height of the gradient/preload bar

    var backgroundOfGradient = "#000000" // Default color while the preload bar is "filling up"



    startingColor[0] = "E"

    startingColor[1] = "E"

    startingColor[2] = "E"



    endingColor[0] = "7"

    endingColor[1] = "8"

    endingColor[2] = "F"



    var gap = 4



    if (!document.all) location.replace(locationAfterPreload)

    var a = 10, b = 11, c = 12, d = 13, e = 14, f=15, i, j, ones = new Array(), sixteens = new Array(), diff = new Array();

    var convert = new Array("0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"), imgLen = yourImages.length;

    var loaded = new Array(), preImages = new Array(), currCount = 0, pending = 0, h = 0, hilite = new Array(), cover = new Array();

    var num = Math.floor(preloadbarWidth/gap);

    for (i = 0; i < 3; i++) {

    startingColor[i] = startingColor[i].toLowerCase();

    endingColor[i] = endingColor[i].toLowerCase();

    startingColor[i] = eval(startingColor[i]);

    endingColor[i] = eval(endingColor[i]);

    diff[i] = (endingColor[i]-startingColor[i])/num;

    ones[i] = Math.floor(diff[i]);

    sixteens[i] = Math.round((diff[i] - ones[i])*15);

    }

    endingColor[0] = 0;

    endingColor[1] = 0;

    endingColor[2] = 0;

    i = 0, j = 0;

    while (i <= num) {

    hilite[i] = "#";

    while (j < 3) {

    hilite[i] += convert[startingColor[j]];

    hilite[i] += convert[endingColor[j]];

    startingColor[j] += ones[j];

    endingColor[j] += sixteens[j];

    if (endingColor[j] > 15) {

    endingColor[j] -= 15;

    startingColor[j]++;

    }

    j++;

    }

    j = 0;

    i++;

    }

    function loadImages() {

    for (i = 0; i < imgLen; i++) {

    preImages[i] = new Image();

    preImages[i].src = yourImages[i];

    loaded[i] = 0;

    cover[i] = Math.floor(num/imgLen)*(i+1)

    }

    cover[cover.length-1] += num%imgLen

    checkLoad();

    }

    function checkLoad() {

    if (pending) { changeto(); return }

    if (currCount == imgLen) { location.replace(locationAfterPreload); return }

    for (i = 0; i < imgLen; i++) {

    if (!loaded[i] && preImages[i].complete) {

    loaded[i] = 1; pending++; currCount++;

    checkLoad();

    return;

    }

    }

    setTimeout("checkLoad()",10);

    }

    function changeto() {

    if (h+1 > cover[currCount-1]) {

    var percent = Math.round(100/imgLen)*currCount;

    if (percent > 100) while (percent != 100) percent--;

    if (currCount == imgLen && percent < 100) percent = 100;

    defaultStatus = "Loaded " + currCount + " out of " + imgLen + " images [" + percent + "%].";

    pending--;

    checkLoad();

    return;

    }

    eval("document.all.cell" + (h+1) + ".style.backgroundColor = hilite[h]");;

    h++;

    setTimeout("changeto()",1);

    }

    defaultStatus = "Loaded 0 out of " + imgLen + " images [0%]."

    // end hiding -->

    </script>

    </head>

    <body bgcolor="#7B85FF">

    <center>

    <font face="Verdana, Arial, Helvetica" size="2">Please wait while images are

    preloading...<script language="JavaScript1.2">

    <!-- beging hiding

    document.write('<table border="0" cellpadding="0" cellspacing="0" width="' + preloadbarWidth + '"><tr height="' + preloadbarHeight + '" bgcolor="' + backgroundOfGradient + '">');

    for (i = 0; i < num; i++) {

    document.write('<td width="' + gap + '" id="cell' + (i+1) + '"></td>');

    }

    document.write('</tr></table>');

    document.write('<p><small><a href="javascript:location.replace(locationAfterPreload)">Skip Preloading</a></small></p></font>')

    loadImages();

    // end hiding -->

    </script>
    </center>

    </body>
    </html>


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •