SitePoint Sponsor

User Tag List

Results 1 to 17 of 17

Thread: Error on Page

  1. #1
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Error on Page

    Hello,
    I ahve a website whcih I am developing locally on my wamp server and it works perfectly in Opera and Firefox and the page shows up in Internet Explorer but one part does not show within it but in the status bar at the bottom it says "Error on Page". How am I meant to know what the error is and fix it if it doesn;t tell me what it is in the first place. Just to let you know, I do not have aversion of the site online for people to check out but I will appreciate all help given.

    Thanks

    Regards,
    Neil

  2. #2
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That sounds like you have a JavaScript error. Would you like me to move this thread to the JavaScript forum?
    Birnam wood is come to Dunsinane

  3. #3
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question

    Yes, Please

    I have found a line of code which is stopping one part of the page from showing in IE but I ahve no idea why:

    PHP Code:
    <!--Javascript includes for prototype tab script-->
    <script src="<?php echo ($linkprefix."tabs/prototype.js"); ?>" type="text/javascript"></script>
    <script type="text/javascript" src="<?php echo ($linkprefix."tabs/fabtabulous.js"); ?>"></script>
    <!--------------------->

    <!--Javascript includes for lightbox script-->
    <script type="text/javascript" src="<?php echo ($linkprefix."js/prototype.js"); ?>"></script>
    <script type="text/javascript" src="<?php echo ($linkprefix."js/scriptaculous.js?load=effects"); ?>"></script>
    <script type="text/javascript" src="<?php echo ($linkprefix."js/lightbox.js"); ?>"></script>
    <!--------------------->
    The code above is the code concerned and it;s the first line of code from the lightbox script. If I remove that then the page loads correctly but the lightbox script has an issue where if I click an image whcih is part of the lightbox script, it opens correctly but the area behind the opened image should darken giving focus to the image but instead of darkening it goes solid black.

    Can any help me with this issue?

    Thanks

    Regards,
    Neil

  4. #4
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    First of all, you should post the generated markup rather than the PHP stuff, since we don't know what $linkprefix contains. Use 'View Source' in the browser and copy the relevant lines.

    Then we need to see the content of the offending JavaScript file. The error isn't likely to occur in the code you've pasted, but in the external file that is included.

    You should see a triangular yellow warning icon in the status bar of IE. If you double-click on that you will get a little more information about the problem. (Not much, though.) Post that, too.
    Birnam wood is come to Dunsinane

  5. #5
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question

    Heres the same block of code from View>Source:

    Code HTML4Strict:
    <!--Javascript includes for prototype tab script-->
    <script src="tabs/prototype.js" type="text/javascript"></script>
    <script type="text/javascript" src="tabs/fabtabulous.js"></script>
    <!--------------------->
     
    <!--Javascript includes for lightbox script-->
    <script type="text/javascript" src="js/prototype.js"></script>
    <script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
    <script type="text/javascript" src="js/lightbox.js"></script>
    <!--------------------->

    the code of the page which is included via this line:

    Code HTML4Strict:
    <script type="text/javascript" src="js/prototype.js"></script>

    is shown below:

    Code:
    /*  Prototype JavaScript framework, version 1.4.0
     *  (c) 2005 Sam Stephenson <sam@conio.net>
     *
     *  THIS FILE IS AUTOMATICALLY GENERATED. When sending patches, please diff
     *  against the source tree, available from the Prototype darcs repository.
     *
     *  Prototype is freely distributable under the terms of an MIT-style license.
     *
     *  For details, see the Prototype web site: http://prototype.conio.net/
     *
    /*--------------------------------------------------------------------------*/
    
    var Prototype = {
      Version: '1.4.0',
      ScriptFragment: '(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)',
    
      emptyFunction: function() {},
      K: function(x) {return x}
    }
    
    var Class = {
      create: function() {
        return function() {
          this.initialize.apply(this, arguments);
        }
      }
    }
    
    var Abstract = new Object();
    
    Object.extend = function(destination, source) {
      for (property in source) {
        destination[property] = source[property];
      }
      return destination;
    }
    
    Object.inspect = function(object) {
      try {
        if (object == undefined) return 'undefined';
        if (object == null) return 'null';
        return object.inspect ? object.inspect() : object.toString();
      } catch (e) {
        if (e instanceof RangeError) return '...';
        throw e;
      }
    }
    
    Function.prototype.bind = function() {
      var __method = this, args = $A(arguments), object = args.shift();
      return function() {
        return __method.apply(object, args.concat($A(arguments)));
      }
    }
    
    Function.prototype.bindAsEventListener = function(object) {
      var __method = this;
      return function(event) {
        return __method.call(object, event || window.event);
      }
    }
    
    Object.extend(Number.prototype, {
      toColorPart: function() {
        var digits = this.toString(16);
        if (this < 16) return '0' + digits;
        return digits;
      },
    
      succ: function() {
        return this + 1;
      },
    
      times: function(iterator) {
        $R(0, this, true).each(iterator);
        return this;
      }
    });
    
    var Try = {
      these: function() {
        var returnValue;
    
        for (var i = 0; i < arguments.length; i++) {
          var lambda = arguments[i];
          try {
            returnValue = lambda();
            break;
          } catch (e) {}
        }
    
        return returnValue;
      }
    }
    
    /*--------------------------------------------------------------------------*/
    
    var PeriodicalExecuter = Class.create();
    PeriodicalExecuter.prototype = {
      initialize: function(callback, frequency) {
        this.callback = callback;
        this.frequency = frequency;
        this.currentlyExecuting = false;
    
        this.registerCallback();
      },
    
      registerCallback: function() {
        setInterval(this.onTimerEvent.bind(this), this.frequency * 1000);
      },
    
      onTimerEvent: function() {
        if (!this.currentlyExecuting) {
          try {
            this.currentlyExecuting = true;
            this.callback();
          } finally {
            this.currentlyExecuting = false;
          }
        }
      }
    }
    
    /*--------------------------------------------------------------------------*/
    
    function $() {
      var elements = new Array();
    
      for (var i = 0; i < arguments.length; i++) {
        var element = arguments[i];
        if (typeof element == 'string')
          element = document.getElementById(element);
    
        if (arguments.length == 1)
          return element;
    
        elements.push(element);
      }
    
      return elements;
    }
    Object.extend(String.prototype, {
      stripTags: function() {
        return this.replace(/<\/?[^>]+>/gi, '');
      },
    
      stripScripts: function() {
        return this.replace(new RegExp(Prototype.ScriptFragment, 'img'), '');
      },
    
      extractScripts: function() {
        var matchAll = new RegExp(Prototype.ScriptFragment, 'img');
        var matchOne = new RegExp(Prototype.ScriptFragment, 'im');
        return (this.match(matchAll) || []).map(function(scriptTag) {
          return (scriptTag.match(matchOne) || ['', ''])[1];
        });
      },
    
      evalScripts: function() {
        return this.extractScripts().map(eval);
      },
    
      escapeHTML: function() {
        var div = document.createElement('div');
        var text = document.createTextNode(this);
        div.appendChild(text);
        return div.innerHTML;
      },
    
      unescapeHTML: function() {
        var div = document.createElement('div');
        div.innerHTML = this.stripTags();
        return div.childNodes[0] ? div.childNodes[0].nodeValue : '';
      },
    
      toQueryParams: function() {
        var pairs = this.match(/^\??(.*)$/)[1].split('&');
        return pairs.inject({}, function(params, pairString) {
          var pair = pairString.split('=');
          params[pair[0]] = pair[1];
          return params;
        });
      },
    
      toArray: function() {
        return this.split('');
      },
    
      camelize: function() {
        var oStringList = this.split('-');
        if (oStringList.length == 1) return oStringList[0];
    
        var camelizedString = this.indexOf('-') == 0
          ? oStringList[0].charAt(0).toUpperCase() + oStringList[0].substring(1)
          : oStringList[0];
    
        for (var i = 1, len = oStringList.length; i < len; i++) {
          var s = oStringList[i];
          camelizedString += s.charAt(0).toUpperCase() + s.substring(1);
        }
    
        return camelizedString;
      },
    
      inspect: function() {
        return "'" + this.replace('\\', '\\\\').replace("'", '\\\'') + "'";
      }
    });
    
    String.prototype.parseQuery = String.prototype.toQueryParams;
    
    var $break    = new Object();
    var $continue = new Object();
    
    var Enumerable = {
      each: function(iterator) {
        var index = 0;
        try {
          this._each(function(value) {
            try {
              iterator(value, index++);
            } catch (e) {
              if (e != $continue) throw e;
            }
          });
        } catch (e) {
          if (e != $break) throw e;
        }
      },
    
      all: function(iterator) {
        var result = true;
        this.each(function(value, index) {
          result = result && !!(iterator || Prototype.K)(value, index);
          if (!result) throw $break;
        });
        return result;
      },
    
      any: function(iterator) {
        var result = true;
        this.each(function(value, index) {
          if (result = !!(iterator || Prototype.K)(value, index))
            throw $break;
        });
        return result;
      },
    
      collect: function(iterator) {
        var results = [];
        this.each(function(value, index) {
          results.push(iterator(value, index));
        });
        return results;
      },
    
      detect: function (iterator) {
        var result;
        this.each(function(value, index) {
          if (iterator(value, index)) {
            result = value;
            throw $break;
          }
        });
        return result;
      },
    
      findAll: function(iterator) {
        var results = [];
        this.each(function(value, index) {
          if (iterator(value, index))
            results.push(value);
        });
        return results;
      },
    
      grep: function(pattern, iterator) {
        var results = [];
        this.each(function(value, index) {
          var stringValue = value.toString();
          if (stringValue.match(pattern))
            results.push((iterator || Prototype.K)(value, index));
        })
        return results;
      },
    
      include: function(object) {
        var found = false;
        this.each(function(value) {
          if (value == object) {
            found = true;
            throw $break;
          }
        });
        return found;
      },
    
      inject: function(memo, iterator) {
        this.each(function(value, index) {
          memo = iterator(memo, value, index);
        });
        return memo;
      },
    
      invoke: function(method) {
        var args = $A(arguments).slice(1);
        return this.collect(function(value) {
          return value[method].apply(value, args);
        });
      },
    
      max: function(iterator) {
        var result;
        this.each(function(value, index) {
          value = (iterator || Prototype.K)(value, index);
          if (value >= (result || value))
            result = value;
        });
        return result;
      },
    
      min: function(iterator) {
        var result;
        this.each(function(value, index) {
          value = (iterator || Prototype.K)(value, index);
          if (value <= (result || value))
            result = value;
        });
        return result;
      },
    
      partition: function(iterator) {
        var trues = [], falses = [];
        this.each(function(value, index) {
          ((iterator || Prototype.K)(value, index) ?
            trues : falses).push(value);
        });
        return [trues, falses];
      },
    
      pluck: function(property) {
        var results = [];
        this.each(function(value, index) {
          results.push(value[property]);
        });
        return results;
      },
    
      reject: function(iterator) {
        var results = [];
        this.each(function(value, index) {
          if (!iterator(value, index))
            results.push(value);
        });
        return results;
      },
    
      sortBy: function(iterator) {
        return this.collect(function(value, index) {
          return {value: value, criteria: iterator(value, index)};
        }).sort(function(left, right) {
          var a = left.criteria, b = right.criteria;
          return a < b ? -1 : a > b ? 1 : 0;
        }).pluck('value');
      },
    
      toArray: function() {
        return this.collect(Prototype.K);
      },
    
      zip: function() {
        var iterator = Prototype.K, args = $A(arguments);
        if (typeof args.last() == 'function')
          iterator = args.pop();
    
        var collections = [this].concat(args).map($A);
        return this.map(function(value, index) {
          iterator(value = collections.pluck(index));
          return value;
        });
      },
    
      inspect: function() {
        return '#<Enumerable:' + this.toArray().inspect() + '>';
      }
    }
    
    Object.extend(Enumerable, {
      map:     Enumerable.collect,
      find:    Enumerable.detect,
      select:  Enumerable.findAll,
      member:  Enumerable.include,
      entries: Enumerable.toArray
    });
    var $A = Array.from = function(iterable) {
      if (!iterable) return [];
      if (iterable.toArray) {
        return iterable.toArray();
      } else {
        var results = [];
        for (var i = 0; i < iterable.length; i++)
          results.push(iterable[i]);
        return results;
      }
    }
    
    Object.extend(Array.prototype, Enumerable);
    
    Array.prototype._reverse = Array.prototype.reverse;
    
    Object.extend(Array.prototype, {
      _each: function(iterator) {
        for (var i = 0; i < this.length; i++)
          iterator(this[i]);
      },
    
      clear: function() {
        this.length = 0;
        return this;
      },
    
      first: function() {
        return this[0];
      },
    
      last: function() {
        return this[this.length - 1];
      },
    
      compact: function() {
        return this.select(function(value) {
          return value != undefined || value != null;
        });
      },
    
      flatten: function() {
        return this.inject([], function(array, value) {
          return array.concat(value.constructor == Array ?
            value.flatten() : [value]);
        });
      },
    
      without: function() {
        var values = $A(arguments);
        return this.select(function(value) {
          return !values.include(value);
        });
      },
    
      indexOf: function(object) {
        for (var i = 0; i < this.length; i++)
          if (this[i] == object) return i;
        return -1;
      },
    
      reverse: function(inline) {
        return (inline !== false ? this : this.toArray())._reverse();
      },
    
      shift: function() {
        var result = this[0];
        for (var i = 0; i < this.length - 1; i++)
          this[i] = this[i + 1];
        this.length--;
        return result;
      },
    
      inspect: function() {
        return '[' + this.map(Object.inspect).join(', ') + ']';
      }
    });
    var Hash = {
      _each: function(iterator) {
        for (key in this) {
          var value = this[key];
          if (typeof value == 'function') continue;
    
          var pair = [key, value];
          pair.key = key;
          pair.value = value;
          iterator(pair);
        }
      },
    
      keys: function() {
        return this.pluck('key');
      },
    
      values: function() {
        return this.pluck('value');
      },
    
      merge: function(hash) {
        return $H(hash).inject($H(this), function(mergedHash, pair) {
          mergedHash[pair.key] = pair.value;
          return mergedHash;
        });
      },
    
      toQueryString: function() {
        return this.map(function(pair) {
          return pair.map(encodeURIComponent).join('=');
        }).join('&');
      },
    
      inspect: function() {
        return '#<Hash:{' + this.map(function(pair) {
          return pair.map(Object.inspect).join(': ');
        }).join(', ') + '}>';
      }
    }
    
    function $H(object) {
      var hash = Object.extend({}, object || {});
      Object.extend(hash, Enumerable);
      Object.extend(hash, Hash);
      return hash;
    }
    ObjectRange = Class.create();
    Object.extend(ObjectRange.prototype, Enumerable);
    Object.extend(ObjectRange.prototype, {
      initialize: function(start, end, exclusive) {
        this.start = start;
        this.end = end;
        this.exclusive = exclusive;
      },
    
      _each: function(iterator) {
        var value = this.start;
        do {
          iterator(value);
          value = value.succ();
        } while (this.include(value));
      },
    
      include: function(value) {
        if (value < this.start)
          return false;
        if (this.exclusive)
          return value < this.end;
        return value <= this.end;
      }
    });
    
    var $R = function(start, end, exclusive) {
      return new ObjectRange(start, end, exclusive);
    }
    
    var Ajax = {
      getTransport: function() {
        return Try.these(
          function() {return new ActiveXObject('Msxml2.XMLHTTP')},
          function() {return new ActiveXObject('Microsoft.XMLHTTP')},
          function() {return new XMLHttpRequest()}
        ) || false;
      },
    
      activeRequestCount: 0
    }
    
    Ajax.Responders = {
      responders: [],
    
      _each: function(iterator) {
        this.responders._each(iterator);
      },
    
      register: function(responderToAdd) {
        if (!this.include(responderToAdd))
          this.responders.push(responderToAdd);
      },
    
      unregister: function(responderToRemove) {
        this.responders = this.responders.without(responderToRemove);
      },
    
      dispatch: function(callback, request, transport, json) {
        this.each(function(responder) {
          if (responder[callback] && typeof responder[callback] == 'function') {
            try {
              responder[callback].apply(responder, [request, transport, json]);
            } catch (e) {}
          }
        });
      }
    };
    
    Object.extend(Ajax.Responders, Enumerable);
    
    Ajax.Responders.register({
      onCreate: function() {
        Ajax.activeRequestCount++;
      },
    
      onComplete: function() {
        Ajax.activeRequestCount--;
      }
    });
    
    Ajax.Base = function() {};
    Ajax.Base.prototype = {
      setOptions: function(options) {
        this.options = {
          method:       'post',
          asynchronous: true,
          parameters:   ''
        }
        Object.extend(this.options, options || {});
      },
    
      responseIsSuccess: function() {
        return this.transport.status == undefined
            || this.transport.status == 0
            || (this.transport.status >= 200 && this.transport.status < 300);
      },
    
      responseIsFailure: function() {
        return !this.responseIsSuccess();
      }
    }
    
    Ajax.Request = Class.create();
    Ajax.Request.Events =
      ['Uninitialized', 'Loading', 'Loaded', 'Interactive', 'Complete'];
    
    Ajax.Request.prototype = Object.extend(new Ajax.Base(), {
      initialize: function(url, options) {
        this.transport = Ajax.getTransport();
        this.setOptions(options);
        this.request(url);
      },
    
      request: function(url) {
        var parameters = this.options.parameters || '';
        if (parameters.length > 0) parameters += '&_=';
    
        try {
          this.url = url;
          if (this.options.method == 'get' && parameters.length > 0)
            this.url += (this.url.match(/\?/) ? '&' : '?') + parameters;
    
          Ajax.Responders.dispatch('onCreate', this, this.transport);
    
          this.transport.open(this.options.method, this.url,
            this.options.asynchronous);
    
          if (this.options.asynchronous) {
            this.transport.onreadystatechange = this.onStateChange.bind(this);
            setTimeout((function() {this.respondToReadyState(1)}).bind(this), 10);
          }
    
          this.setRequestHeaders();
    
          var body = this.options.postBody ? this.options.postBody : parameters;
          this.transport.send(this.options.method == 'post' ? body : null);
    
        } catch (e) {
          this.dispatchException(e);
        }
      },
    
      setRequestHeaders: function() {
        var requestHeaders =
          ['X-Requested-With', 'XMLHttpRequest',
           'X-Prototype-Version', Prototype.Version];
    
        if (this.options.method == 'post') {
          requestHeaders.push('Content-type',
            'application/x-www-form-urlencoded');
    
          /* Force "Connection: close" for Mozilla browsers to work around
           * a bug where XMLHttpReqeuest sends an incorrect Content-length
           * header. See Mozilla Bugzilla #246651.
           */
          if (this.transport.overrideMimeType)
            requestHeaders.push('Connection', 'close');
        }
    
        if (this.options.requestHeaders)
          requestHeaders.push.apply(requestHeaders, this.options.requestHeaders);
    
        for (var i = 0; i < requestHeaders.length; i += 2)
          this.transport.setRequestHeader(requestHeaders[i], requestHeaders[i+1]);
      },
    
      onStateChange: function() {
        var readyState = this.transport.readyState;
        if (readyState != 1)
          this.respondToReadyState(this.transport.readyState);
      },
    
      header: function(name) {
        try {
          return this.transport.getResponseHeader(name);
        } catch (e) {}
      },
    
      evalJSON: function() {
        try {
          return eval(this.header('X-JSON'));
        } catch (e) {}
      },
    
      evalResponse: function() {
        try {
          return eval(this.transport.responseText);
        } catch (e) {
          this.dispatchException(e);
        }
      },
    
      respondToReadyState: function(readyState) {
        var event = Ajax.Request.Events[readyState];
        var transport = this.transport, json = this.evalJSON();
    
        if (event == 'Complete') {
          try {
            (this.options['on' + this.transport.status]
             || this.options['on' + (this.responseIsSuccess() ? 'Success' : 'Failure')]
             || Prototype.emptyFunction)(transport, json);
          } catch (e) {
            this.dispatchException(e);
          }
    
          if ((this.header('Content-type') || '').match(/^text\/javascript/i))
            this.evalResponse();
        }
    
        try {
          (this.options['on' + event] || Prototype.emptyFunction)(transport, json);
          Ajax.Responders.dispatch('on' + event, this, transport, json);
        } catch (e) {
          this.dispatchException(e);
        }
    
        /* Avoid memory leak in MSIE: clean up the oncomplete event handler */
        if (event == 'Complete')
          this.transport.onreadystatechange = Prototype.emptyFunction;
      },
    
      dispatchException: function(exception) {
        (this.options.onException || Prototype.emptyFunction)(this, exception);
        Ajax.Responders.dispatch('onException', this, exception);
      }
    });
    
    Ajax.Updater = Class.create();
    
    Object.extend(Object.extend(Ajax.Updater.prototype, Ajax.Request.prototype), {
      initialize: function(container, url, options) {
        this.containers = {
          success: container.success ? $(container.success) : $(container),
          failure: container.failure ? $(container.failure) :
            (container.success ? null : $(container))
        }
    
        this.transport = Ajax.getTransport();
        this.setOptions(options);
    
        var onComplete = this.options.onComplete || Prototype.emptyFunction;
        this.options.onComplete = (function(transport, object) {
          this.updateContent();
          onComplete(transport, object);
        }).bind(this);
    
        this.request(url);
      },
    
      updateContent: function() {
        var receiver = this.responseIsSuccess() ?
          this.containers.success : this.containers.failure;
        var response = this.transport.responseText;
    
        if (!this.options.evalScripts)
          response = response.stripScripts();
    
        if (receiver) {
          if (this.options.insertion) {
            new this.options.insertion(receiver, response);
          } else {
            Element.update(receiver, response);
          }
        }
    
        if (this.responseIsSuccess()) {
          if (this.onComplete)
            setTimeout(this.onComplete.bind(this), 10);
        }
      }
    });
    
    Ajax.PeriodicalUpdater = Class.create();
    Ajax.PeriodicalUpdater.prototype = Object.extend(new Ajax.Base(), {
      initialize: function(container, url, options) {
        this.setOptions(options);
        this.onComplete = this.options.onComplete;
    
        this.frequency = (this.options.frequency || 2);
        this.decay = (this.options.decay || 1);
    
        this.updater = {};
        this.container = container;
        this.url = url;
    
        this.start();
      },
    
      start: function() {
        this.options.onComplete = this.updateComplete.bind(this);
        this.onTimerEvent();
      },
    
      stop: function() {
        this.updater.onComplete = undefined;
        clearTimeout(this.timer);
        (this.onComplete || Prototype.emptyFunction).apply(this, arguments);
      },
    
      updateComplete: function(request) {
        if (this.options.decay) {
          this.decay = (request.responseText == this.lastText ?
            this.decay * this.options.decay : 1);
    
          this.lastText = request.responseText;
        }
        this.timer = setTimeout(this.onTimerEvent.bind(this),
          this.decay * this.frequency * 1000);
      },
    
      onTimerEvent: function() {
        this.updater = new Ajax.Updater(this.container, this.url, this.options);
      }
    });
    document.getElementsByClassName = function(className, parentElement) {
      var children = ($(parentElement) || document.body).getElementsByTagName('*');
      return $A(children).inject([], function(elements, child) {
        if (child.className.match(new RegExp("(^|\\s)" + className + "(\\s|$)")))
          elements.push(child);
        return elements;
      });
    }
    
    /*--------------------------------------------------------------------------*/
    
    if (!window.Element) {
      var Element = new Object();
    }
    
    Object.extend(Element, {
      visible: function(element) {
        return $(element).style.display != 'none';
      },
    
      toggle: function() {
        for (var i = 0; i < arguments.length; i++) {
          var element = $(arguments[i]);
          Element[Element.visible(element) ? 'hide' : 'show'](element);
        }
      },
    
      hide: function() {
        for (var i = 0; i < arguments.length; i++) {
          var element = $(arguments[i]);
          element.style.display = 'none';
        }
      },
    
      show: function() {
        for (var i = 0; i < arguments.length; i++) {
          var element = $(arguments[i]);
          element.style.display = '';
        }
      },
    
      remove: function(element) {
        element = $(element);
        element.parentNode.removeChild(element);
      },
    
      update: function(element, html) {
        $(element).innerHTML = html.stripScripts();
        setTimeout(function() {html.evalScripts()}, 10);
      },
    
      getHeight: function(element) {
        element = $(element);
        return element.offsetHeight;
      },
    
      classNames: function(element) {
        return new Element.ClassNames(element);
      },
    
      hasClassName: function(element, className) {
        if (!(element = $(element))) return;
        return Element.classNames(element).include(className);
      },
    
      addClassName: function(element, className) {
        if (!(element = $(element))) return;
        return Element.classNames(element).add(className);
      },
    
      removeClassName: function(element, className) {
        if (!(element = $(element))) return;
        return Element.classNames(element).remove(className);
      },
    
      // removes whitespace-only text node children
      cleanWhitespace: function(element) {
        element = $(element);
        for (var i = 0; i < element.childNodes.length; i++) {
          var node = element.childNodes[i];
          if (node.nodeType == 3 && !/\S/.test(node.nodeValue))
            Element.remove(node);
        }
      },
    
      empty: function(element) {
        return $(element).innerHTML.match(/^\s*$/);
      },
    
      scrollTo: function(element) {
        element = $(element);
        var x = element.x ? element.x : element.offsetLeft,
            y = element.y ? element.y : element.offsetTop;
        window.scrollTo(x, y);
      },
    
      getStyle: function(element, style) {
        element = $(element);
        var value = element.style[style.camelize()];
        if (!value) {
          if (document.defaultView && document.defaultView.getComputedStyle) {
            var css = document.defaultView.getComputedStyle(element, null);
            value = css ? css.getPropertyValue(style) : null;
          } else if (element.currentStyle) {
            value = element.currentStyle[style.camelize()];
          }
        }
    
        if (window.opera && ['left', 'top', 'right', 'bottom'].include(style))
          if (Element.getStyle(element, 'position') == 'static') value = 'auto';
    
        return value == 'auto' ? null : value;
      },
    
      setStyle: function(element, style) {
        element = $(element);
        for (name in style)
          element.style[name.camelize()] = style[name];
      },
    
      getDimensions: function(element) {
        element = $(element);
        if (Element.getStyle(element, 'display') != 'none')
          return {width: element.offsetWidth, height: element.offsetHeight};
    
        // All *Width and *Height properties give 0 on elements with display none,
        // so enable the element temporarily
        var els = element.style;
        var originalVisibility = els.visibility;
        var originalPosition = els.position;
        els.visibility = 'hidden';
        els.position = 'absolute';
        els.display = '';
        var originalWidth = element.clientWidth;
        var originalHeight = element.clientHeight;
        els.display = 'none';
        els.position = originalPosition;
        els.visibility = originalVisibility;
        return {width: originalWidth, height: originalHeight};
      },
    
      makePositioned: function(element) {
        element = $(element);
        var pos = Element.getStyle(element, 'position');
        if (pos == 'static' || !pos) {
          element._madePositioned = true;
          element.style.position = 'relative';
          // Opera returns the offset relative to the positioning context, when an
          // element is position relative but top and left have not been defined
          if (window.opera) {
            element.style.top = 0;
            element.style.left = 0;
          }
        }
      },
    
      undoPositioned: function(element) {
        element = $(element);
        if (element._madePositioned) {
          element._madePositioned = undefined;
          element.style.position =
            element.style.top =
            element.style.left =
            element.style.bottom =
            element.style.right = '';
        }
      },
    
      makeClipping: function(element) {
        element = $(element);
        if (element._overflow) return;
        element._overflow = element.style.overflow;
        if ((Element.getStyle(element, 'overflow') || 'visible') != 'hidden')
          element.style.overflow = 'hidden';
      },
    
      undoClipping: function(element) {
        element = $(element);
        if (element._overflow) return;
        element.style.overflow = element._overflow;
        element._overflow = undefined;
      }
    });
    
    var Toggle = new Object();
    Toggle.display = Element.toggle;
    
    /*--------------------------------------------------------------------------*/
    
    Abstract.Insertion = function(adjacency) {
      this.adjacency = adjacency;
    }
    
    Abstract.Insertion.prototype = {
      initialize: function(element, content) {
        this.element = $(element);
        this.content = content.stripScripts();
    
        if (this.adjacency && this.element.insertAdjacentHTML) {
          try {
            this.element.insertAdjacentHTML(this.adjacency, this.content);
          } catch (e) {
            if (this.element.tagName.toLowerCase() == 'tbody') {
              this.insertContent(this.contentFromAnonymousTable());
            } else {
              throw e;
            }
          }
        } else {
          this.range = this.element.ownerDocument.createRange();
          if (this.initializeRange) this.initializeRange();
          this.insertContent([this.range.createContextualFragment(this.content)]);
        }
    
        setTimeout(function() {content.evalScripts()}, 10);
      },
    
      contentFromAnonymousTable: function() {
        var div = document.createElement('div');
        div.innerHTML = '<table><tbody>' + this.content + '</tbody></table>';
        return $A(div.childNodes[0].childNodes[0].childNodes);
      }
    }
    
    var Insertion = new Object();
    
    Insertion.Before = Class.create();
    Insertion.Before.prototype = Object.extend(new Abstract.Insertion('beforeBegin'), {
      initializeRange: function() {
        this.range.setStartBefore(this.element);
      },
    
      insertContent: function(fragments) {
        fragments.each((function(fragment) {
          this.element.parentNode.insertBefore(fragment, this.element);
        }).bind(this));
      }
    });
    
    Insertion.Top = Class.create();
    Insertion.Top.prototype = Object.extend(new Abstract.Insertion('afterBegin'), {
      initializeRange: function() {
        this.range.selectNodeContents(this.element);
        this.range.collapse(true);
      },
    
      insertContent: function(fragments) {
        fragments.reverse(false).each((function(fragment) {
          this.element.insertBefore(fragment, this.element.firstChild);
        }).bind(this));
      }
    });
    
    Insertion.Bottom = Class.create();
    Insertion.Bottom.prototype = Object.extend(new Abstract.Insertion('beforeEnd'), {
      initializeRange: function() {
        this.range.selectNodeContents(this.element);
        this.range.collapse(this.element);
      },
    
      insertContent: function(fragments) {
        fragments.each((function(fragment) {
          this.element.appendChild(fragment);
        }).bind(this));
      }
    });
    
    Insertion.After = Class.create();
    Insertion.After.prototype = Object.extend(new Abstract.Insertion('afterEnd'), {
      initializeRange: function() {
        this.range.setStartAfter(this.element);
      },
    
      insertContent: function(fragments) {
        fragments.each((function(fragment) {
          this.element.parentNode.insertBefore(fragment,
            this.element.nextSibling);
        }).bind(this));
      }
    });
    
    /*--------------------------------------------------------------------------*/
    
    Element.ClassNames = Class.create();
    Element.ClassNames.prototype = {
      initialize: function(element) {
        this.element = $(element);
      },
    
      _each: function(iterator) {
        this.element.className.split(/\s+/).select(function(name) {
          return name.length > 0;
        })._each(iterator);
      },
    
      set: function(className) {
        this.element.className = className;
      },
    
      add: function(classNameToAdd) {
        if (this.include(classNameToAdd)) return;
        this.set(this.toArray().concat(classNameToAdd).join(' '));
      },
    
      remove: function(classNameToRemove) {
        if (!this.include(classNameToRemove)) return;
        this.set(this.select(function(className) {
          return className != classNameToRemove;
        }).join(' '));
      },
    
      toString: function() {
        return this.toArray().join(' ');
      }
    }
    
    Object.extend(Element.ClassNames.prototype, Enumerable);
    var Field = {
      clear: function() {
        for (var i = 0; i < arguments.length; i++)
          $(arguments[i]).value = '';
      },
    
      focus: function(element) {
        $(element).focus();
      },
    
      present: function() {
        for (var i = 0; i < arguments.length; i++)
          if ($(arguments[i]).value == '') return false;
        return true;
      },
    
      select: function(element) {
        $(element).select();
      },
    
      activate: function(element) {
        element = $(element);
        element.focus();
        if (element.select)
          element.select();
      }
    }
    
    /*--------------------------------------------------------------------------*/
    
    var Form = {
      serialize: function(form) {
        var elements = Form.getElements($(form));
        var queryComponents = new Array();
    
        for (var i = 0; i < elements.length; i++) {
          var queryComponent = Form.Element.serialize(elements[i]);
          if (queryComponent)
            queryComponents.push(queryComponent);
        }
    
        return queryComponents.join('&');
      },
    
      getElements: function(form) {
        form = $(form);
        var elements = new Array();
    
        for (tagName in Form.Element.Serializers) {
          var tagElements = form.getElementsByTagName(tagName);
          for (var j = 0; j < tagElements.length; j++)
            elements.push(tagElements[j]);
        }
        return elements;
      },
    
      getInputs: function(form, typeName, name) {
        form = $(form);
        var inputs = form.getElementsByTagName('input');
    
        if (!typeName && !name)
          return inputs;
    
        var matchingInputs = new Array();
        for (var i = 0; i < inputs.length; i++) {
          var input = inputs[i];
          if ((typeName && input.type != typeName) ||
              (name && input.name != name))
            continue;
          matchingInputs.push(input);
        }
    
        return matchingInputs;
      },
    
      disable: function(form) {
        var elements = Form.getElements(form);
        for (var i = 0; i < elements.length; i++) {
          var element = elements[i];
          element.blur();
          element.disabled = 'true';
        }
      },
    
      enable: function(form) {
        var elements = Form.getElements(form);
        for (var i = 0; i < elements.length; i++) {
          var element = elements[i];
          element.disabled = '';
        }
      },
    
      findFirstElement: function(form) {
        return Form.getElements(form).find(function(element) {
          return element.type != 'hidden' && !element.disabled &&
            ['input', 'select', 'textarea'].include(element.tagName.toLowerCase());
        });
      },
    
      focusFirstElement: function(form) {
        Field.activate(Form.findFirstElement(form));
      },
    
      reset: function(form) {
        $(form).reset();
      }
    }
    
    Form.Element = {
      serialize: function(element) {
        element = $(element);
        var method = element.tagName.toLowerCase();
        var parameter = Form.Element.Serializers[method](element);
    
        if (parameter) {
          var key = encodeURIComponent(parameter[0]);
          if (key.length == 0) return;
    
          if (parameter[1].constructor != Array)
            parameter[1] = [parameter[1]];
    
          return parameter[1].map(function(value) {
            return key + '=' + encodeURIComponent(value);
          }).join('&');
        }
      },
    
      getValue: function(element) {
        element = $(element);
        var method = element.tagName.toLowerCase();
        var parameter = Form.Element.Serializers[method](element);
    
        if (parameter)
          return parameter[1];
      }
    }
    
    Form.Element.Serializers = {
      input: function(element) {
        switch (element.type.toLowerCase()) {
          case 'submit':
          case 'hidden':
          case 'password':
          case 'text':
            return Form.Element.Serializers.textarea(element);
          case 'checkbox':
          case 'radio':
            return Form.Element.Serializers.inputSelector(element);
        }
        return false;
      },
    
      inputSelector: function(element) {
        if (element.checked)
          return [element.name, element.value];
      },
    
      textarea: function(element) {
        return [element.name, element.value];
      },
    
      select: function(element) {
        return Form.Element.Serializers[element.type == 'select-one' ?
          'selectOne' : 'selectMany'](element);
      },
    
      selectOne: function(element) {
        var value = '', opt, index = element.selectedIndex;
        if (index >= 0) {
          opt = element.options[index];
          value = opt.value;
          if (!value && !('value' in opt))
            value = opt.text;
        }
        return [element.name, value];
      },
    
      selectMany: function(element) {
        var value = new Array();
        for (var i = 0; i < element.length; i++) {
          var opt = element.options[i];
          if (opt.selected) {
            var optValue = opt.value;
            if (!optValue && !('value' in opt))
              optValue = opt.text;
            value.push(optValue);
          }
        }
        return [element.name, value];
      }
    }
    
    /*--------------------------------------------------------------------------*/
    
    var $F = Form.Element.getValue;
    
    /*--------------------------------------------------------------------------*/
    
    Abstract.TimedObserver = function() {}
    Abstract.TimedObserver.prototype = {
      initialize: function(element, frequency, callback) {
        this.frequency = frequency;
        this.element   = $(element);
        this.callback  = callback;
    
        this.lastValue = this.getValue();
        this.registerCallback();
      },
    
      registerCallback: function() {
        setInterval(this.onTimerEvent.bind(this), this.frequency * 1000);
      },
    
      onTimerEvent: function() {
        var value = this.getValue();
        if (this.lastValue != value) {
          this.callback(this.element, value);
          this.lastValue = value;
        }
      }
    }
    
    Form.Element.Observer = Class.create();
    Form.Element.Observer.prototype = Object.extend(new Abstract.TimedObserver(), {
      getValue: function() {
        return Form.Element.getValue(this.element);
      }
    });
    
    Form.Observer = Class.create();
    Form.Observer.prototype = Object.extend(new Abstract.TimedObserver(), {
      getValue: function() {
        return Form.serialize(this.element);
      }
    });
    
    /*--------------------------------------------------------------------------*/
    
    Abstract.EventObserver = function() {}
    Abstract.EventObserver.prototype = {
      initialize: function(element, callback) {
        this.element  = $(element);
        this.callback = callback;
    
        this.lastValue = this.getValue();
        if (this.element.tagName.toLowerCase() == 'form')
          this.registerFormCallbacks();
        else
          this.registerCallback(this.element);
      },
    
      onElementEvent: function() {
        var value = this.getValue();
        if (this.lastValue != value) {
          this.callback(this.element, value);
          this.lastValue = value;
        }
      },
    
      registerFormCallbacks: function() {
        var elements = Form.getElements(this.element);
        for (var i = 0; i < elements.length; i++)
          this.registerCallback(elements[i]);
      },
    
      registerCallback: function(element) {
        if (element.type) {
          switch (element.type.toLowerCase()) {
            case 'checkbox':
            case 'radio':
              Event.observe(element, 'click', this.onElementEvent.bind(this));
              break;
            case 'password':
            case 'text':
            case 'textarea':
            case 'select-one':
            case 'select-multiple':
              Event.observe(element, 'change', this.onElementEvent.bind(this));
              break;
          }
        }
      }
    }
    
    Form.Element.EventObserver = Class.create();
    Form.Element.EventObserver.prototype = Object.extend(new Abstract.EventObserver(), {
      getValue: function() {
        return Form.Element.getValue(this.element);
      }
    });
    
    Form.EventObserver = Class.create();
    Form.EventObserver.prototype = Object.extend(new Abstract.EventObserver(), {
      getValue: function() {
        return Form.serialize(this.element);
      }
    });
    if (!window.Event) {
      var Event = new Object();
    }
    
    Object.extend(Event, {
      KEY_BACKSPACE: 8,
      KEY_TAB:       9,
      KEY_RETURN:   13,
      KEY_ESC:      27,
      KEY_LEFT:     37,
      KEY_UP:       38,
      KEY_RIGHT:    39,
      KEY_DOWN:     40,
      KEY_DELETE:   46,
    
      element: function(event) {
        return event.target || event.srcElement;
      },
    
      isLeftClick: function(event) {
        return (((event.which) && (event.which == 1)) ||
                ((event.button) && (event.button == 1)));
      },
    
      pointerX: function(event) {
        return event.pageX || (event.clientX +
          (document.documentElement.scrollLeft || document.body.scrollLeft));
      },
    
      pointerY: function(event) {
        return event.pageY || (event.clientY +
          (document.documentElement.scrollTop || document.body.scrollTop));
      },
    
      stop: function(event) {
        if (event.preventDefault) {
          event.preventDefault();
          event.stopPropagation();
        } else {
          event.returnValue = false;
          event.cancelBubble = true;
        }
      },
    
      // find the first node with the given tagName, starting from the
      // node the event was triggered on; traverses the DOM upwards
      findElement: function(event, tagName) {
        var element = Event.element(event);
        while (element.parentNode && (!element.tagName ||
            (element.tagName.toUpperCase() != tagName.toUpperCase())))
          element = element.parentNode;
        return element;
      },
    
      observers: false,
    
      _observeAndCache: function(element, name, observer, useCapture) {
        if (!this.observers) this.observers = [];
        if (element.addEventListener) {
          this.observers.push([element, name, observer, useCapture]);
          element.addEventListener(name, observer, useCapture);
        } else if (element.attachEvent) {
          this.observers.push([element, name, observer, useCapture]);
          element.attachEvent('on' + name, observer);
        }
      },
    
      unloadCache: function() {
        if (!Event.observers) return;
        for (var i = 0; i < Event.observers.length; i++) {
          Event.stopObserving.apply(this, Event.observers[i]);
          Event.observers[i][0] = null;
        }
        Event.observers = false;
      },
    
      observe: function(element, name, observer, useCapture) {
        var element = $(element);
        useCapture = useCapture || false;
    
        if (name == 'keypress' &&
            (navigator.appVersion.match(/Konqueror|Safari|KHTML/)
            || element.attachEvent))
          name = 'keydown';
    
        this._observeAndCache(element, name, observer, useCapture);
      },
    
      stopObserving: function(element, name, observer, useCapture) {
        var element = $(element);
        useCapture = useCapture || false;
    
        if (name == 'keypress' &&
            (navigator.appVersion.match(/Konqueror|Safari|KHTML/)
            || element.detachEvent))
          name = 'keydown';
    
        if (element.removeEventListener) {
          element.removeEventListener(name, observer, useCapture);
        } else if (element.detachEvent) {
          element.detachEvent('on' + name, observer);
        }
      }
    });
    
    /* prevent memory leaks in IE */
    Event.observe(window, 'unload', Event.unloadCache, false);
    var Position = {
      // set to true if needed, warning: firefox performance problems
      // NOT neeeded for page scrolling, only if draggable contained in
      // scrollable elements
      includeScrollOffsets: false,
    
      // must be called before calling withinIncludingScrolloffset, every time the
      // page is scrolled
      prepare: function() {
        this.deltaX =  window.pageXOffset
                    || document.documentElement.scrollLeft
                    || document.body.scrollLeft
                    || 0;
        this.deltaY =  window.pageYOffset
                    || document.documentElement.scrollTop
                    || document.body.scrollTop
                    || 0;
      },
    
      realOffset: function(element) {
        var valueT = 0, valueL = 0;
        do {
          valueT += element.scrollTop  || 0;
          valueL += element.scrollLeft || 0;
          element = element.parentNode;
        } while (element);
        return [valueL, valueT];
      },
    
      cumulativeOffset: function(element) {
        var valueT = 0, valueL = 0;
        do {
          valueT += element.offsetTop  || 0;
          valueL += element.offsetLeft || 0;
          element = element.offsetParent;
        } while (element);
        return [valueL, valueT];
      },
    
      positionedOffset: function(element) {
        var valueT = 0, valueL = 0;
        do {
          valueT += element.offsetTop  || 0;
          valueL += element.offsetLeft || 0;
          element = element.offsetParent;
          if (element) {
            p = Element.getStyle(element, 'position');
            if (p == 'relative' || p == 'absolute') break;
          }
        } while (element);
        return [valueL, valueT];
      },
    
      offsetParent: function(element) {
        if (element.offsetParent) return element.offsetParent;
        if (element == document.body) return element;
    
        while ((element = element.parentNode) && element != document.body)
          if (Element.getStyle(element, 'position') != 'static')
            return element;
    
        return document.body;
      },
    
      // caches x/y coordinate pair to use with overlap
      within: function(element, x, y) {
        if (this.includeScrollOffsets)
          return this.withinIncludingScrolloffsets(element, x, y);
        this.xcomp = x;
        this.ycomp = y;
        this.offset = this.cumulativeOffset(element);
    
        return (y >= this.offset[1] &&
                y <  this.offset[1] + element.offsetHeight &&
                x >= this.offset[0] &&
                x <  this.offset[0] + element.offsetWidth);
      },
    
      withinIncludingScrolloffsets: function(element, x, y) {
        var offsetcache = this.realOffset(element);
    
        this.xcomp = x + offsetcache[0] - this.deltaX;
        this.ycomp = y + offsetcache[1] - this.deltaY;
        this.offset = this.cumulativeOffset(element);
    
        return (this.ycomp >= this.offset[1] &&
                this.ycomp <  this.offset[1] + element.offsetHeight &&
                this.xcomp >= this.offset[0] &&
                this.xcomp <  this.offset[0] + element.offsetWidth);
      },
    
      // within must be called directly before
      overlap: function(mode, element) {
        if (!mode) return 0;
        if (mode == 'vertical')
          return ((this.offset[1] + element.offsetHeight) - this.ycomp) /
            element.offsetHeight;
        if (mode == 'horizontal')
          return ((this.offset[0] + element.offsetWidth) - this.xcomp) /
            element.offsetWidth;
      },
    
      clone: function(source, target) {
        source = $(source);
        target = $(target);
        target.style.position = 'absolute';
        var offsets = this.cumulativeOffset(source);
        target.style.top    = offsets[1] + 'px';
        target.style.left   = offsets[0] + 'px';
        target.style.width  = source.offsetWidth + 'px';
        target.style.height = source.offsetHeight + 'px';
      },
    
      page: function(forElement) {
        var valueT = 0, valueL = 0;
    
        var element = forElement;
        do {
          valueT += element.offsetTop  || 0;
          valueL += element.offsetLeft || 0;
    
          // Safari fix
          if (element.offsetParent==document.body)
            if (Element.getStyle(element,'position')=='absolute') break;
    
        } while (element = element.offsetParent);
    
        element = forElement;
        do {
          valueT -= element.scrollTop  || 0;
          valueL -= element.scrollLeft || 0;
        } while (element = element.parentNode);
    
        return [valueL, valueT];
      },
    
      clone: function(source, target) {
        var options = Object.extend({
          setLeft:    true,
          setTop:     true,
          setWidth:   true,
          setHeight:  true,
          offsetTop:  0,
          offsetLeft: 0
        }, arguments[2] || {})
    
        // find page position of source
        source = $(source);
        var p = Position.page(source);
    
        // find coordinate system to use
        target = $(target);
        var delta = [0, 0];
        var parent = null;
        // delta [0,0] will do fine with position: fixed elements,
        // position:absolute needs offsetParent deltas
        if (Element.getStyle(target,'position') == 'absolute') {
          parent = Position.offsetParent(target);
          delta = Position.page(parent);
        }
    
        // correct by body offsets (fixes Safari)
        if (parent == document.body) {
          delta[0] -= document.body.offsetLeft;
          delta[1] -= document.body.offsetTop;
        }
    
        // set position
        if(options.setLeft)   target.style.left  = (p[0] - delta[0] + options.offsetLeft) + 'px';
        if(options.setTop)    target.style.top   = (p[1] - delta[1] + options.offsetTop) + 'px';
        if(options.setWidth)  target.style.width = source.offsetWidth + 'px';
        if(options.setHeight) target.style.height = source.offsetHeight + 'px';
      },
    
      absolutize: function(element) {
        element = $(element);
        if (element.style.position == 'absolute') return;
        Position.prepare();
    
        var offsets = Position.positionedOffset(element);
        var top     = offsets[1];
        var left    = offsets[0];
        var width   = element.clientWidth;
        var height  = element.clientHeight;
    
        element._originalLeft   = left - parseFloat(element.style.left  || 0);
        element._originalTop    = top  - parseFloat(element.style.top || 0);
        element._originalWidth  = element.style.width;
        element._originalHeight = element.style.height;
    
        element.style.position = 'absolute';
        element.style.top    = top + 'px';;
        element.style.left   = left + 'px';;
        element.style.width  = width + 'px';;
        element.style.height = height + 'px';;
      },
    
      relativize: function(element) {
        element = $(element);
        if (element.style.position == 'relative') return;
        Position.prepare();
    
        element.style.position = 'relative';
        var top  = parseFloat(element.style.top  || 0) - (element._originalTop || 0);
        var left = parseFloat(element.style.left || 0) - (element._originalLeft || 0);
    
        element.style.top    = top + 'px';
        element.style.left   = left + 'px';
        element.style.height = element._originalHeight;
        element.style.width  = element._originalWidth;
      }
    }
    
    // Safari returns margins on body which is incorrect if the child is absolutely
    // positioned.  For performance reasons, redefine Position.cumulativeOffset for
    // KHTML/WebKit only.
    if (/Konqueror|Safari|KHTML/.test(navigator.userAgent)) {
      Position.cumulativeOffset = function(element) {
        var valueT = 0, valueL = 0;
        do {
          valueT += element.offsetTop  || 0;
          valueL += element.offsetLeft || 0;
          if (element.offsetParent == document.body)
            if (Element.getStyle(element, 'position') == 'absolute') break;
    
          element = element.offsetParent;
        } while (element);
    
        return [valueL, valueT];
      }
    }
    and the text from the yellow icon message is as follows:

    Problems with this webpage might prevent it from being displayed properly or functioning properly.

    Line: 33
    Char: 3
    Error: Object doesn;t support this property or method
    Code: 0


    Thanks, I eagerly await your help!

    Regards,
    Neil

  6. #6
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Are you sure that's the file where the error occurs? I've used Prototype 1.4.0 with IE without problems. Line 33 is inside the definition of Object.extend() and shouldn't cause the problem you're seeing.

    Unless there's a problem with some place where Object.extend() is called in a subsequent JavaScript file. In that case you have some detective work to do.
    Birnam wood is come to Dunsinane

  7. #7
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question

    Sorry,
    I did mean Line 33 of the page so here is the full page code of the page where the error occured but there is ntohing on Line 33:

    HTML Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    
    <head>
    
    <!--Favicon Link-->
    <link rel="shortcut icon" href="favicon.ico" >
    <!--------------------->
    
    <!--Meta Tags-->
    <!--Meta Tags-->
    <meta name="classification" content="Entertainment" />
    <meta name="description" content="Alton Towers Mania, a great resource about the UK's number 1 theme park, Alton Towers." />
    <meta name="MSSmartTagsPreventParsing" content="TRUE" />
    <meta name="keywords" content="alton towers, towers street, merrie england, katanga canyon, gloomy wood, forbidden valley, old macdonalds farmyard, storybook land, adventure land, x-sector, the towers, fountain square, ug land, the gardens, splash landings hotel, alton towers hotel, waterpark, cariba creek, teacups, the flume, splash kart challenge, congo river rapids, runaway mine train, duel, haunted house, thunderlooper, nemesis, blade, ripsaw, air, ribena berry bish bash, doodle doo derby, riverbank eye spy express, squirrel nutty ride, spinball whizzer, beastie, oblivion, enterprise, submission, black hole, hex, legend of the towers, rita, queen of speed, corkscrew, the, ug swinger, bone shaker, 1001 nights, charlie and the chocolate factory, toyland tours, peugeot, driving school, family days out, staffordshire, alton, jcb, farley, ride tracker, news, electric towers, chocolate towers, 207, Bolliger &amp; Mabilard, Intamin, Huss, Days out, extraordinary, flying machine, carribean, halloween, summer, lake, thrilling, adrenaline, hogs head, grill, ride tracker, forums, roller coasters, themeparks, amusement parks, days out, alton, towers, castle, ghost, hunt" />
    <meta name="robots" content="ALL" />
    <meta name="rating" content="Safe For Kids" />
    <meta name="author" content="Neil Tonge" />
    <meta http-equiv="reply-to" content="rctneil@aol.com" />
    
    <!--<meta http-equiv="Page-Exit" content="progid:DXImageTransform.Microsoft.Fade(duration=2,overlap=0);" />--><!--------------------->
    
    <!--Stylesheet Links-->
    <link href="stylesheets/reset_styles.css" rel="stylesheet" type="text/css" />
    <link href="stylesheets/layout.css" rel="stylesheet" type="text/css" />
    <link href="stylesheets/navigation.css" rel="stylesheet" type="text/css" />
    <link href="stylesheets/misc.css" rel="stylesheet" type="text/css" />
    <link href="stylesheets/tabs.css" rel="stylesheet" type="text/css" />
    <link href="stylesheets/lightbox.css" rel="stylesheet" type="text/css" media="screen" />
    <!--------------------->
    
    <!--Javascript includes for prototype tab script-->
    <script src="tabs/prototype.js" type="text/javascript"></script>
    <script type="text/javascript" src="tabs/fabtabulous.js"></script>
    <!--------------------->
    
    <!--Javascript includes for lightbox script-->
    <script type="text/javascript" src="js/prototype.js"></script>
    <script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
    <script type="text/javascript" src="js/lightbox.js"></script>
    <!--------------------->
    
    <!--Block of Javascript for drop down parts-->
    <script type="text/javascript">
    function toggle( targetId ){
    if (document.getElementById){
    target = document.getElementById( targetId );
    if (target.style.display == "none"){
    target.style.display = "";
    } else {
    target.style.display = "none";
    }
    }
    }
    </script>
    <!--------------------->
    
    
    <!--Block of javascript for hint boxes-->
    <script type="text/javascript">	
    var horizontal_offset="9px" //horizontal offset of hint box from anchor link
    
    /////No further editting needed
    
    var vertical_offset="0" //horizontal offset of hint box from anchor link. No need to change.
    var ie=document.all
    var ns6=document.getElementById&&!document.all
    
    function getposOffset(what, offsettype){
    var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
    var parentEl=what.offsetParent;
    while (parentEl!=null){
    totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
    parentEl=parentEl.offsetParent;
    }
    return totaloffset;
    }
    
    function iecompattest(){
    return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
    }
    
    function clearbrowseredge(obj, whichedge){
    var edgeoffset=(whichedge=="rightedge")? parseInt(horizontal_offset)*-1 : parseInt(vertical_offset)*-1
    if (whichedge=="rightedge"){
    var windowedge=ie && !window.opera? iecompattest().scrollLeft+iecompattest().clientWidth-30 : window.pageXOffset+window.innerWidth-40
    dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
    if (windowedge-dropmenuobj.x < dropmenuobj.contentmeasure)
    edgeoffset=dropmenuobj.contentmeasure+obj.offsetWidth+parseInt(horizontal_offset)
    }
    else{
    var windowedge=ie && !window.opera? iecompattest().scrollTop+iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18
    dropmenuobj.contentmeasure=dropmenuobj.offsetHeight
    if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure)
    edgeoffset=dropmenuobj.contentmeasure-obj.offsetHeight
    }
    return edgeoffset
    }
    
    function showhint(menucontents, obj, e, tipwidth){
    if ((ie||ns6) && document.getElementById("hintbox")){
    dropmenuobj=document.getElementById("hintbox")
    dropmenuobj.innerHTML=menucontents
    dropmenuobj.style.left=dropmenuobj.style.top=-500
    if (tipwidth!=""){
    dropmenuobj.widthobj=dropmenuobj.style
    dropmenuobj.widthobj.width=tipwidth
    }
    dropmenuobj.x=getposOffset(obj, "left")
    dropmenuobj.y=getposOffset(obj, "top")
    dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+obj.offsetWidth+"px"
    dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+"px"
    dropmenuobj.style.visibility="visible"
    obj.onmouseout=hidetip
    }
    }
    
    function hidetip(e){
    dropmenuobj.style.visibility="hidden"
    dropmenuobj.style.left="-500px"
    }
    
    function createhintbox(){
    var divblock=document.createElement("div")
    divblock.setAttribute("id", "hintbox")
    document.body.appendChild(divblock)
    }
    
    if (window.addEventListener)
    window.addEventListener("load", createhintbox, false)
    else if (window.attachEvent)
    window.attachEvent("onload", createhintbox)
    else if (document.getElementById)
    window.onload=createhintbox
    </script>
    <!--------------------->
    
    
    
    <!--Set the page title-->
    <title>Alton Towers Mania - For everything Alton Towers! :: Resort Guide</title><!--------------------->
    
    </head>
    
    <body>
    
    <div id="bigwrapper">
    
    			<!--If live.txt exits then include live db connection code otherwise include local db connection code-->
    						<!--------------------->
    
    <div id="container">
    
    
    <div id="header">
    	<a href="index.php">
    		<img src="img/site_graphics/header/header.jpg" alt="Alton Towers Mania" />
    	</a>
    </div>
    
    
    <div id="navigation">
    	<img src="img/headings/navbar_headings/navigation.jpg" alt="Navigation" class="heading" />
    
    <div id="navlinks">
    <ul>
    	<li>-&nbsp;<a href="index.php">Home</a></li>
    	<li>-&nbsp;<a href="guides.php">Guides</a></li>
    	<li>-&nbsp;<a href="featuresinfo.php">Features & Info</a></li>
    	<li>-&nbsp;<a href="multimedia.php">Multimedia</a></li>
    	<li>-&nbsp;<a href="map.php">Resort Map</a></li>
    	<li>-&nbsp;<a href="photokorn">Image Gallery</a></li>
    	<li>-&nbsp;<a href="#.php">Community Forum</a></li>
    	<li>-&nbsp;<a href="contactus.php">Contact Us</a></li>
    </ul>
    </div>
    <img src="img/small_graphics/menu_divider.gif" class="menudivider" />
    
    <img src="img/headings/navbar_headings/status.jpg" alt="Resort Status" class="heading" />
    <div id="status">
    	<p>Theme Park:<img src="img/small_graphics/park_status/open.gif" alt="The theme park is currently OPEN." /></p>
    	<p>Hotels:<img src="img/small_graphics/park_status/open.gif" alt="The hotels are currently OPEN." /></p>
    	<p>Spa:<img src="img/small_graphics/park_status/open.gif" alt="The spa is currently OPEN." /></p>
    	<p>Waterpark:<img src="img/small_graphics/park_status/open.gif" alt="The waterpark is currently OPEN." /></p>
    	<p>Golf:<img src="img/small_graphics/park_status/open.gif" alt="The golf is currently OPEN." /></p>
    	<p>Conf Centre:<img src="img/small_graphics/park_status/open.gif" alt="The conference centre is currently OPEN." /></p>
    </div>
    
    <img src="img/small_graphics/menu_divider.gif" class="menudivider" />
    
    <img src="img/headings/navbar_headings/daytip.jpg" alt="Day Tip" class="heading" />
    <div id="tip">
    	<p>
    		Water rides are not the busiest of attractions at the beginning of the day so if you do not mind getting a little wet, head straight for those first!	</p>
    	<br />
    </div>
    
    <img src="img/small_graphics/menu_divider.gif" class="menudivider" />
    
    <img src="img/headings/navbar_headings/randomride.jpg" alt="Random Ride" class="heading" />
    <div id="randomride">
    	<p>
    		<a href="ride_detail.php?ride_id=34">Hex - The Legend of the Towers</a>	</p>
    </div>
    
    <img src="img/small_graphics/menu_divider.gif" class="menudivider" />
    
    <!--Creates a bit of space at bottom of nav-->
    <br />
    <br />
    <br />
    <br />
    
    
    </div>
    
    <div id="content">
    
    	<div id="breadcrumb">
    			</div>
    
    	<div id="date">
    			</div>	<!--####################### - START PAGE CONTENT - ################################-->
    
    	<!--Background Sound Module-->
    		<!--End Background Sound Module-->
    	
    	<!--Title Image or Text Module-->
    		<div class="sbl onridepage">
    		<div class="sbr">
    			<div class="stl">
    				<div class="str">
    					<div class="ride_heading">Extraordinary Golf</div>
    				</div>
    			</div>
    		</div>
    	</div>
    	<br /><!--Adds a line space after name of area-->
    
    		<!--/Title Image or Text Module-->
    	<br />
    	
    	<div id="mainmenu">
    		<ul id="tabs">
    			<li>
    				<a href="#tab1">Intro</a>
    			</li>
    			<!--If an includetab is available then show it-->
    								<li>
    						<a href="#tab2">Courses & Holes</a>
    					</li>
    						
    			
    						
    			
    						<li>
    				<a href="#tab5">Location</a>
    			</li>
    			<li>
    				<a href="#tab6">Gallery</a>
    			</li>
    			<li>
    				<a href="#tab7">Multimedia</a>
    			</li>
    			<li>
    				<a href="#tab8">Links</a>
    			</li>
    			<li>
    				<a href="#tab9">Comments</a>
    			</li>
    		</ul>
    	</div>
    	
    	<div class="tab_blend"></div>
    
    <div>
    	<!--------------------------------------------------------------------------------------------------------------------------------->
        <div class="panel" id="tab1"><!--Start of tab 1-->
    		<div class="box1">
    			<img src="img/headings/introduction.jpg" class="heading" alt="Introduction" />
    		</div>
    		<div class="box2">
    		<div class="averagebox">
    			<p>
    				Average Visitor Rating:
    			</p>
    			<img src="img/votestars/00star.gif" />&nbsp;-&nbsp;0 Ratings		</div>
    		</div>
    		<div class="clearer"></div>
    		
    		<hr />
    		
    		<!--Review and pic goes in here-->
    		<p><img src="img/guide_pics/resort/golf.jpg" alt="Ride Photo" class="ride_photo" />Extraordinary Golf was introduced at Alton Towers for the 2007 season and is positioned directly behind the Car Park Monorail Station next to the Splash Landings Hotel. The complex is split into 2 courses and consists of a total of 18 holes, (9 on each course). Visitors can choose whether to play all 18 holes or just 9 of them. As you approach the entrance of Extraordinary Golf, you will see the main entrance building is a replica of the towers complex. This building houses a couple of vending machines and the booth where you rent your golf clubs and balls. Each holes is themed to a specific ride or location within the themepark and is excellently themed. Sound effects are also to be heard by each hole as you pass by. Once you have completed the course a special hole is available which allows you to have a chance at winning a free round of golf by knocking the golf ball into the centre hole of a dartboard style course. The holes have different crazy features about them ranging from hitting the ball into the plughole of the Flume hole to navigating the branches of the Hex hole. Each hole has an easy and hard route and a par score.</p>		
    		<br />
    		<br />
    	</div>
    	<!--------------------------------------------------------------------------------------------------------------------------------->
    				<div class="panel" id="tab2"><!--Start of tab 2-->
    				<img src="img/headings/coursesholes.jpg" alt="Courses & Holes" />
    <br />
    <p>
    	Check out what courses you will be encountering and the best way to achieve the lowest score by viewing our exclusive hole diagrams.
    </p>
    <hr />
    
    <br /><br />
    
    <h2>East Course</h2>
    <br />
    
    <table>
    	<tr>
    		<th width="10%">
    			<h2>
    				Hole Number
    			</h2>
    		</th>
    		<th width="20%">
    			<h2>
    				Hole Name
    			</h2>
    		</th>
    		<th width="40%">
    			<h2>
    				Description
    			</h2>
    		</th>
    		<th width="10%">
    			<h2>
    				Par Score
    			</h2>
    		</th>
    		<th width="20%">
    			<h2>
    				Course Diagram - <small>Click to enlarge</small>
    			</h2>
    		</th>
    	</tr>
    
    	<tr>
    		<td>
    			1
    		</td>
    		<td>
    			Katanga Canyon Hole
    		</td>
    		<td>
    			Putt your way around Katanga Canyon in this african colonial village themed hole.
    		</td>
    		<td>
    			Par 2
    		</td>
    		<td>
    		<!-- start PZ3 code -->
    			<a href="img/small_graphics/golf_courses/1.jpg" rel="lightbox[golf_courses]" title="RED - Hard Route, YELLOW - Easy Route"><img src="img/small_graphics/golf_courses/1.jpg" width="100" /></a>
    		<!-- end PZ3 code -->
    		</td>
    	</tr>
    	
    	<tr>
    		<td>
    			2
    		</td>
    		<td>
    			Congo River Rapids Hole
    		</td>
    		<td>
    			Make our way through churning rapids and under the shelter but mind the sand pits.
    		</td>
    		<td>
    			Par 3
    		</td>
    		<td>
    		<!-- start PZ3 code -->
    			<a href="img/small_graphics/golf_courses/2.jpg" rel="lightbox[golf_courses]" title="RED - Hard Route, YELLOW - Easy Route"><img src="img/small_graphics/golf_courses/2.jpg" width="100" /></a>
    		<!-- end PZ3 code -->
    		</td>
    	</tr>
    	
    	<tr>
    		<td>
    			3
    		</td>
    		<td>
    			X-Sector Hole
    		</td>
    		<td>
    			This hole is filled with tunnels and ramps so be extra cautious.
    		</td>
    		<td>
    			Par 3
    		</td>
    		<td>
    		<!-- start PZ3 code -->
    			<a href="img/small_graphics/golf_courses/3.jpg" rel="lightbox[golf_courses]" title="RED - Hard Route, YELLOW - Easy Route"><img src="img/small_graphics/golf_courses/3.jpg" width="100" /></a>
    		<!-- end PZ3 code -->
    		</td>
    	</tr>
    	
    	<tr>
    		<td>
    			4
    		</td>
    		<td>
    			Oblivion Hole
    		</td>
    		<td>
    			DON'T LOOK DOWN, putt your ball down into Oblivion!
    		</td>
    		<td>
    			Par 3
    		</td>
    		<td>
    		<!-- start PZ3 code -->
    			<a href="img/small_graphics/golf_courses/4.jpg" rel="lightbox[golf_courses]" title="RED - Hard Route, YELLOW - Easy Route"><img src="img/small_graphics/golf_courses/4.jpg" width="100" /></a>
    		<!-- end PZ3 code -->
    		</td>
    	</tr>
    	
    	<tr>
    		<td>
    			5
    		</td>
    		<td>
    			Old MacDonalds Farm Chicken Run Hole
    		</td>
    		<td>
    			Dodge the broken eggs on the course and make it to the hole.
    		</td>
    		<td>
    			Par 3
    		</td>
    		<td>
    		<!-- start PZ3 code -->
    			<a href="img/small_graphics/golf_courses/5.jpg" rel="lightbox[golf_courses]" title="RED - Hard Route, YELLOW - Easy Route"><img src="img/small_graphics/golf_courses/5.jpg" width="100" /></a>
    		<!-- end PZ3 code -->
    		</td>
    	</tr>
    	
    	<tr>
    		<td>
    			6
    		</td>
    		<td>
    			Old MacDonalds Farm Windmill Hole
    		</td>
    		<td>
    			Weave in and out of the milk churns an then make your way through the windmill and then into the hole by the pumpkins under the watchful eye of a friendly scarecrow.
    		</td>
    		<td>
    			Par 4
    		</td>
    		<td>
    		<!-- start PZ3 code -->
    			<a href="img/small_graphics/golf_courses/6.jpg" rel="lightbox[golf_courses]" title="RED - Hard Route, YELLOW - Easy Route"><img src="img/small_graphics/golf_courses/6.jpg" width="100" /></a>
    		<!-- end PZ3 code -->
    		</td>
    	</tr>
    	
    	<tr>
    		<td>
    			7
    		</td>
    		<td>
    			Rita Hole
    		</td>
    		<td>
    			A long thin course to build up speed up to the hole.
    		</td>
    		<td>
    			Par 3
    		</td>
    		<td>
    		<!-- start PZ3 code -->
    			<a href="img/small_graphics/golf_courses/7.jpg" rel="lightbox[golf_courses]" title="WHITE - Main Route"><img src="img/small_graphics/golf_courses/7.jpg" width="100" /></a>
    		<!-- end PZ3 code -->
    		</td>
    	</tr>
    	
    	<tr>
    		<td>
    			8
    		</td>
    		<td>
    			Ug Land Hole
    		</td>
    		<td>
    			Watch out for the Dinosaurs!
    		</td>
    		<td>
    			Par 2
    		</td>
    		<td>
    		<!-- start PZ3 code -->
    			<a href="img/small_graphics/golf_courses/8.jpg" rel="lightbox[golf_courses]" title="RED - Hard Route, YELLOW - Easy Route"><img src="img/small_graphics/golf_courses/8.jpg" width="100" /></a>
    		<!-- end PZ3 code -->
    		</td>
    	</tr>
    	
    	<tr>
    		<td>
    			9
    		</td>
    		<td>
    			Duel Hole
    		</td>
    		<td>
    			Keep your witts about you as this hole has several tomb stones scattered around and a large tomb building which towers over the course with a flock of crows scattered of the roof watching your every move.
    		</td>
    		<td>
    			Par 4
    		</td>
    		<td>
    		<!-- start PZ3 code -->
    			<a href="img/small_graphics/golf_courses/9.jpg" rel="lightbox[golf_courses]" title="RED - Hard Route, YELLOW - Easy Route"><img src="img/small_graphics/golf_courses/9.jpg" width="100" /></a>
    		<!-- end PZ3 code -->
    		</td>
    	</tr>
    
    </table>
    
    <br /><br /><br />
    <!----------------------------------------SECOND TABLE------------------------------------------>
    <h2>East Course</h2>
    
    <br />
    
    <table>
    	<tr>
    		<th width="10%">
    			<h2>
    				Hole Number
    			</h2>
    		</th>
    		<th width="20%">
    			<h2>
    				Hole Name
    			</h2>
    		</th>
    		<th width="40%">
    			<h2>
    				Description
    			</h2>
    		</th>
    		<th width="10%">
    			<h2>
    				Par Score
    			</h2>
    		</th>
    		<th width="20%">
    			<h2>
    				Course Diagram - <small>Click to enlarge</small>
    			</h2>
    		</th>
    	</tr>
    
    	<tr>
    		<td>
    			10
    		</td>
    		<td>
    			Nemesis Hole
    		</td>
    		<td>
    			The Nemesis Hole is a simple starter hole with a steepish incline at the far end. An out and back style hole.
    		</td>
    		<td>
    			Par ?
    		</td>
    		<td>
    		<!-- start PZ3 code -->
    			<a href="img/small_graphics/golf_courses/10.jpg" rel="lightbox[golf_courses]" title="RED - Hard Route, YELLOW - Easy Route"><img src="img/small_graphics/golf_courses/10.jpg" width="100" /></a>
    		<!-- end PZ3 code -->
    		</td>
    	</tr>
    	
    	<tr>
    		<td>
    			11
    		</td>
    		<td>
    			Nemesis Monster Hole
    		</td>
    		<td>
    			This hole is plagued with a huge model of the Nemesis monster overwatching. The hole is on the far side of a hill which needs to be putted over. A small tunnel under the course itself is available for small children to play in.
    		</td>
    		<td>
    			Par ?
    		</td>
    		<td>
    		<!-- start PZ3 code -->
    			<a href="img/small_graphics/golf_courses/11.jpg" rel="lightbox[golf_courses]" title="RED - Hard Route, YELLOW - Easy Route"><img src="img/small_graphics/golf_courses/11.jpg" width="100" /></a>
    		<!-- end PZ3 code -->
    		</td>
    	</tr>
    	
    	<tr>
    		<td>
    			12
    		</td>
    		<td>
    			Ripsaw Hole
    		</td>
    		<td>
    			The Ripsaw hole is rather interesting as it incorporates a massive vertical loop. A spiral tunnel route is also available which wraps it's way around the loop.
    		</td>
    		<td>
    			Par ?
    		</td>
    		<td>
    		<!-- start PZ3 code -->
    			<a href="img/small_graphics/golf_courses/12.jpg" rel="lightbox[golf_courses]" title="RED - Hard Route, YELLOW - Easy Route"><img src="img/small_graphics/golf_courses/12.jpg" width="100" /></a>
    		<!-- end PZ3 code -->
    		</td>
    	</tr>
    	
    	<tr>
    		<td>
    			13
    		</td>
    		<td>
    			Air Hole
    		</td>
    		<td>
    			The Air hole has a water jump for the hard route or a wire tunnel for the easier one. Once over the stream is a wide putting green.
    		</td>
    		<td>
    			Par ?
    		</td>
    		<td>
    		<!-- start PZ3 code -->
    			<a href="img/small_graphics/golf_courses/13.jpg" rel="lightbox[golf_courses]" title="RED - Hard Route, YELLOW - Easy Route"><img src="img/small_graphics/golf_courses/13.jpg" width="100" /></a>
    		<!-- end PZ3 code -->
    		</td>
    	</tr>
    	
    	<tr>
    		<td>
    			14
    		</td>
    		<td>
    			Hex Hole
    		</td>
    		<td>
    			The Hex hole is blocked in the middle by several branches of the Old Oak Tree from the legend. There are several routes you can choose through tunnel in the logs to reach the hole on the other side!
    		</td>
    		<td>
    			Par ?
    		</td>
    		<td>
    		<!-- start PZ3 code -->
    			<a href="img/small_graphics/golf_courses/14.jpg" rel="lightbox[golf_courses]" title="RED - Hard Route, YELLOW - Easy Route"><img src="img/small_graphics/golf_courses/14.jpg" width="100" /></a>
    		<!-- end PZ3 code -->
    		</td>
    	</tr>
    	
    	<tr>
    		<td>
    			15
    		</td>
    		<td>
    			Squirrel Nutty Hole
    		</td>
    		<td>
    			An intreiging course which features two acorns on the course which need to be putted around before putting into the hole situated inside a hollow tree.
    		</td>
    		<td>
    			Par ?
    		</td>
    		<td>
    		<!-- start PZ3 code -->
    			<a href="img/small_graphics/golf_courses/15.jpg" rel="lightbox[golf_courses]" title="RED - Hard Route, YELLOW - Easy Route"><img src="img/small_graphics/golf_courses/15.jpg" width="100" /></a>
    		<!-- end PZ3 code -->
    		</td>
    	</tr>
    	
    	<tr>
    		<td>
    			16
    		</td>
    		<td>
    			Flume Hole
    		</td>
    		<td>
    			This hole has a steep incline to a water tap where you can flush the ball down the drain to be emptied out on the other side into the hole! If your putting skills are not up to making it down the drain then an easier route is available.
    		</td>
    		<td>
    			Par ?
    		</td>
    		<td>
    		<!-- start PZ3 code -->
    			<a href="img/small_graphics/golf_courses/16.jpg" rel="lightbox[golf_courses]" title="RED - Hard Route, YELLOW - Easy Route"><img src="img/small_graphics/golf_courses/16.jpg" width="100" /></a>
    		<!-- end PZ3 code -->
    		</td>
    	</tr>
    	
    	<tr>
    		<td>
    			17
    		</td>
    		<td>
    			Teacups Hole
    		</td>
    		<td>
    			Hit the ball up the hill and around to enter into the giant china teacup! - Watch the sugarcubes.
    		</td>
    		<td>
    			Par ?
    		</td>
    		<td>
    		<!-- start PZ3 code -->
    			<a href="img/small_graphics/golf_courses/17.jpg" rel="lightbox[golf_courses]" title="RED - Hard Route, YELLOW - Easy Route"><img src="img/small_graphics/golf_courses/17.jpg" width="100" /></a>
    		<!-- end PZ3 code -->
    		</td>
    	</tr>
    	
    	<tr>
    		<td>
    			18
    		</td>
    		<td>
    			Driving School Hole
    		</td>
    		<td>
    			Dodge traffic cones and signs on the road surface of this hole. Small openings are avilable in the signage to shorten your route. Don't get caught by the speed camera!
    		</td>
    		<td>
    			Par ?
    		</td>
    		<td>
    		<!-- start PZ3 code -->
    			<a href="img/small_graphics/golf_courses/18.jpg" rel="lightbox[golf_courses]" title="RED - Hard Route, YELLOW - Easy Route"><img src="img/small_graphics/golf_courses/18.jpg" width="100" /></a>
    		<!-- end PZ3 code -->
    		</td>
    	</tr>
    
    </table>
    			</div>
    		<!--------------------------------------------------------------------------------------------------------------------------------->
    		<!--------------------------------------------------------------------------------------------------------------------------------->
    		<!--------------------------------------------------------------------------------------------------------------------------------->
    	<div class="panel" id="tab5"><!--Start of tab 5-->
    		<img src="img/headings/location.jpg" class="heading" alt="Location" />
    
    		
    	No map is available for Extraordinary Golf at this time.		
    		<hr />
    		
    		<!--Map will go here-->
    
    		
    		<br />
    		<br />
    	</div>
    	<!--------------------------------------------------------------------------------------------------------------------------------->
    	<div class="panel" id="tab6"><!--Start of tab 6-->
    		<img src="img/headings/gallery.jpg" class="heading" alt="Gallery" />
    		<p>
    			The gallery for Extraordinary Golf is shown below. Click any thumbnail to enlarge it.
    		</p>
    		
    		<hr />
    		
    		<br />
    		<br />
    		
    			
    <!--If live.txt exits then use the first block of code for live otherwise use the bottom
    <!----------------------->
    
    <table border="0" cellpadding="10" cellspacing="1" width="100%"><tr>
    <td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=3"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772056-9.jpg" width="160" height="120" border="0" title="Views: 13
    Downloads: 3
    Date: 09.04.08
    1600x1200 (600.9 KB)" alt="Views: 13
    Downloads: 3
    Date: 09.04.08
    1600x1200 (600.9 KB)" /></a><br />Air on it's ba...</td><td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=7"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772063-9.jpg" width="160" height="120" border="0" title="Views: 12
    Downloads: 2
    Date: 09.04.08
    1280x960 (471.6 KB)" alt="Views: 12
    Downloads: 2
    Date: 09.04.08
    1280x960 (471.6 KB)" /></a><br />More track!</td><td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=8"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772065-9.jpg" width="160" height="120" border="0" title="Views: 8
    Downloads: 2
    Date: 09.04.08
    1280x960 (459.7 KB)" alt="Views: 8
    Downloads: 2
    Date: 09.04.08
    1280x960 (459.7 KB)" /></a><br />Air on it's co...</td>
    </tr>
    <tr>
    <td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=2"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772054-9.jpg" width="160" height="120" border="0" title="Views: 5
    Downloads: 0
    Date: 09.04.08
    1600x1200 (608.7 KB)" alt="Views: 5
    Downloads: 0
    Date: 09.04.08
    1600x1200 (608.7 KB)" /></a><br />Another rock s...</td><td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=5"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772060-9.jpg" width="160" height="120" border="0" title="Views: 7
    Downloads: 2
    Date: 09.04.08
    1280x960 (434.1 KB)" alt="Views: 7
    Downloads: 2
    Date: 09.04.08
    1280x960 (434.1 KB)" /></a><br />One of the hel...</td><td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=11"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772071-9.jpg" width="160" height="120" border="0" title="Views: 24
    Downloads: 6
    Date: 09.04.08
    2272x1704 (1.0 MB)" alt="Views: 24
    Downloads: 6
    Date: 09.04.08
    2272x1704 (1.0 MB)" /></a><br />Forbidden Vall...</td>
    </tr>
    <tr>
    <td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=6"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772061-9.jpg" width="160" height="120" border="0" title="Views: 10
    Downloads: 1
    Date: 09.04.08
    1280x960 (444.6 KB)" alt="Views: 10
    Downloads: 1
    Date: 09.04.08
    1280x960 (444.6 KB)" /></a><br />The rock struc...</td><td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=9"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772067-9.jpg" width="160" height="120" border="0" title="Views: 7
    Downloads: 2
    Date: 09.04.08
    1280x960 (456.2 KB)" alt="Views: 7
    Downloads: 2
    Date: 09.04.08
    1280x960 (456.2 KB)" /></a><br />Inside the sta...</td><td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=4"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772058-9.jpg" width="160" height="120" border="0" title="Views: 7
    Downloads: 1
    Date: 09.04.08
    1280x960 (445.1 KB)" alt="Views: 7
    Downloads: 1
    Date: 09.04.08
    1280x960 (445.1 KB)" /></a><br />Looking toward...</td>
    </tr>
    <tr>
    <td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=10"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772068-9.jpg" width="160" height="120" border="0" title="Views: 11
    Downloads: 2
    Date: 09.04.08
    2272x1704 (910.9 KB)" alt="Views: 11
    Downloads: 2
    Date: 09.04.08
    2272x1704 (910.9 KB)" /></a><br />The Air shop</td></table>
    			<!--If live.txt exits then include live db connection code otherwise include local db connection code-->
    						<!--------------------->
    
    
    		<br />
    		<br />
    	</div>
    	<!--------------------------------------------------------------------------------------------------------------------------------->
    	<div class="panel" id="tab7"><!--Start of tab 7-->
    		<img src="img/headings/multimedia.jpg" class="heading" alt="Multimedia" />
    		<p>
    			Any multimedia available for Extraordinary Golf is shown below. The links will take you to a page with more detailed information about that piece of multimedia.
    		</p>
    		
    		<hr />
    		<br />
    		
    		<p>No Multimedia Items are available for Extraordinary Golf at this time.</p>	
    	
    	<br />
    	<br />
    	</div>     
    	<!--------------------------------------------------------------------------------------------------------------------------------->       
    	<div class="panel" id="tab8"><!--Start of tab 8-->
    		<img src="img/headings/links.jpg" class="heading" alt="Related Links" />
    		<p>
    			Any external links to do with Extraordinary Golf are shown below.
    		</p>
    		
    		<hr />
    		<br />
    
    		<ul class="styledlist"></ul>
    
    	<br />
    	<br />
    	</div>
    	<!--------------------------------------------------------------------------------------------------------------------------------->
    	<div class="panel" id="tab9"><!--Start of tab -->
    		<img src="img/headings/comments.jpg" class="heading" alt="Comments" />
    		<p>
    			To add a comment of your own about Extraordinary Golf then please use the form at the bottom.
    		</p>
    
    		<hr />
    
    		No comments are available for Extraordinary Golf at this time.<br />		
    		<hr />
    
    		<h1>
    			Submit Your Comment!
    		</h1>
    		<br />
    		
    		<div class="form_container">
    	<form action="" name="addcommentform" method="post">
    	
    			<label for="name">Name:</label>
    			<input id="name" name="name" type="text" value="" />
    
    		<br />
    		
    			<label for="email">E-Mail Address:</label>
    			<input id="email" name="email" type="text" value="" />
    
    		<br />
    
    			<label for="emailshow">Show E-Mail on site?:</label>
    			<input id="emailshow" name="emailshow" type="checkbox" checked="checked" />
    			
    		<br />
    		
    			<label for="rating">Rating:</label>
    			<input type="radio"	value="1star" id="rating" name="rating"  />
    			<img src="img/votestars/1star.gif" alt="1 Star Rating" />
    		<br />
    			<label>&nbsp;</label><input type="radio" value="2star" id="rating" name="rating"  />
    			<img src="img/votestars/2star.gif" alt="2 Star Rating" />
    		<br />	
    			<label>&nbsp;</label><input type="radio" value="3star" id="rating" name="rating"  />
    			<img src="img/votestars/3star.gif" alt="3 Star Rating" />
    		<br />	
    			<label>&nbsp;</label><input type="radio" value="4star" id="rating" name="rating"  />
    			<img src="img/votestars/4star.gif" alt="4 Star Rating" />
    		<br />
    			<label>&nbsp;</label><input type="radio" value="5star" id="rating" name="rating"  />
    			<img src="img/votestars/5star.gif" alt="5 Star Rating" />
    
    		<br />
    
    			<label for="comment">Comment:</label>
    			<label>&nbsp;</label><textarea cols="40" rows="8" id="comment" name="comment"></textarea>
    
    		<br />
    		<br />
    
    			<label>&nbsp;</label><input type="submit" value="Submit Comment" id="submit" name="submit" />
    			<label>&nbsp;</label><input type="reset" value="Reset Form" id="reset" name="reset" />
    
    	</form>
    </div>
    
    	<br />
    	<br />
    	</div>
    	<!--------------------------------------------------------------------------------------------------------------------------------->
    </div>
    <!--------------------------------------------------------------------------------------------------------------------------------->
    <!--######################## - END PAGE CONTENT - ##################################-->
    
    <div id="insidefooter" style="text-align: center;">
    	<br /><br />
    	<hr />
    	<p><a href="#top">Top of Page</a> | Version 3.1 alpha</p>
    
    	<!--Code to remove the dotted line around ActiveX controls-->
    	<script type="text/javascript" src="swfobject.js"></script>
    	
    	<br /><br />
    	
    	<!--If live.txt exits then show infobox with link to admin panel-->
    			<div class="infobox">
    			<p style="text-align: center;">
    				<b>
    					DEVELOPMENTAL VERSION - <a href="admin/index.php" target="_blank">Admin Panel</a>
    				</b>
    			</p>
    		</div>
    		<br /><br />
    	<!-------------end--------->
    	
    </div><!--End Inside Footer-->
    
    </div><!--End Content-->
    
    
    <!--Pulls content div down around all the floats-->
    <div class="clearer"></div>
    
    </div><!--End Container-->
    
    <br /><br />
    
    <!--Adverts-->
    		<fieldset style="width: 600px; text-align: center; margin-left: auto; margin-right: auto;">
    			<legend>
    				Advertisements
    			</legend>
    			<!--Google AdSense-->
    			<script type="text/javascript"><!--
    google_ad_client = "pub-1527442551569821";
    /* 468x60, created 12/08/08 */
    google_ad_slot = "9627959331";
    google_ad_width = 468;
    google_ad_height = 60;
    //-->
    			</script>
    			<script type="text/javascript"
    src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
    			</script>
    			<!--End Google Adsense-->
    			<br />
    			<br />
    			<!--Attraction Tix Advert Banner-->
    			<a href="http://www.attractiontix.co.uk/alton-towers.asp" target="_blank"><img src="img/links/attraction_tix_banner.gif" alt="Alton Towers tickets at Attraction Tix" /></a>
    			<!--End Attraction Tix Advert Banner-->
    			<br />
    			<br />
    			<!--Better than Banners Advert-->
    			   			<!--End Better than Banners Advert-->
    		</fieldset>
    	<!--End Adverts-->
    
    </div><!--End Bigwrapper-->
    
    </body>
    </html>
    Thanks

    Regards,
    Neil

  8. #8
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by rctneil View Post
    Sorry,
    I did mean Line 33 of the page so here is the full page code of the page where the error occured but there is ntohing on Line 33:
    The line number reported by IE is notoriously difficult to interpret. Since you have external JS files, it's most likely that the error occurs on (or at least near) line 33 in one of those files. Unfortunately, IE doesn't tell you which one.

    You need to look at each JS file and examine the code in the vicinity of line 33 of each one to see if you find something that could cause the error.

    I had to hunt down an IE error the other day, just like this one. It took me a while to find the right file, but the line number was more or less correct (within that file).
    Birnam wood is come to Dunsinane

  9. #9
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    But you said that line 33 in the javscript file I posted would be fine and like I said if i take out the link to that file then the page displays fine but the lightbox script has a black background instead of just being translucent black. I DO NOT know if the lightbox script does that when I put that line back in as the lightbox script is within the part that doesn;t show up when that line is in the file. Any ideas?

    Thanks

    Regards,
    Neil

  10. #10
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by rctneil View Post
    But you said that line 33 in the javscript file I posted would be fine
    That's because you said the error occured in that file, and I believed you. Now that you've provided more information, I can tell you that it's not at all certain (or even likely) that the error occurs in prototype.js.

    Quote Originally Posted by rctneil View Post
    and like I said if i take out the link to that file then the page displays fine but the lightbox script has a black background instead of just being translucent black.
    Take a look near line 33 in the lightbox script, and see if it does something suspicious. I've never used lightbox, so I can't be of much help there (either ).
    Birnam wood is come to Dunsinane

  11. #11
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I don;t really know javascript but I have posted lightbox.js below:

    Code:
    // -----------------------------------------------------------------------------------
    //
    //	Lightbox v2.03
    //	by Lokesh Dhakar - http://www.huddletogether.com
    //	4/9/06
    //
    //	For more information on this script, visit:
    //	http://huddletogether.com/projects/lightbox2/
    //
    //	Licensed under the Creative Commons Attribution 2.5 License - http://creativecommons.org/licenses/by/2.5/
    //	
    //	Credit also due to those who have helped, inspired, and made their code available to the public.
    //	Including: Scott Upton(uptonic.com), Peter-Paul Koch(quirksmode.org), Thomas Fuchs(mir.aculo.us), and others.
    //
    //	Lightbox v2.03a
    //	by Dynamicdrive.com- http://www.dynamicdrive.com
    //	Nov 29th, 2007
    //	Added ability for the caption ("title" attr of link) to be optionally hyperlinked, by throwing in a "rev" attr containing the desired link
    // -----------------------------------------------------------------------------------
    /*
    
    	Table of Contents
    	-----------------
    	Configuration
    	Global Variables
    
    	Extending Built-in Objects	
    	- Object.extend(Element)
    	- Array.prototype.removeDuplicates()
    	- Array.prototype.empty()
    
    	Lightbox Class Declaration
    	- initialize()
    	- start()
    	- changeImage()
    	- resizeImageContainer()
    	- showImage()
    	- updateDetails()
    	- updateNav()
    	- enableKeyboardNav()
    	- disableKeyboardNav()
    	- keyboardAction()
    	- preloadNeighborImages()
    	- end()
    	
    	Miscellaneous Functions
    	- getPageScroll()
    	- getPageSize()
    	- getKey()
    	- listenKey()
    	- showSelectBoxes()
    	- hideSelectBoxes()
    	- showFlash()
    	- hideFlash()
    	- pause()
    	- initLightbox()
    	
    	Function Calls
    	- addLoadEvent(initLightbox)
    	
    */
    // -----------------------------------------------------------------------------------
    
    //
    //	Configuration
    //
    var fileLoadingImage = "images/loading.gif";		
    var fileBottomNavCloseImage = "images/closelabel.gif";
    
    var animate = true;	// toggles resizing animations
    var resizeSpeed = 7;	// controls the speed of the image resizing animations (1=slowest and 10=fastest)
    
    var borderSize = 10;	//if you adjust the padding in the CSS, you will need to update this variable
    
    // -----------------------------------------------------------------------------------
    
    //
    //	Global Variables
    //
    var imageArray = new Array;
    var activeImage;
    
    if(animate == true){
    	overlayDuration = 0.2;	// shadow fade in/out duration
    	if(resizeSpeed > 10){ resizeSpeed = 10;}
    	if(resizeSpeed < 1){ resizeSpeed = 1;}
    	resizeDuration = (11 - resizeSpeed) * 0.15;
    } else { 
    	overlayDuration = 0;
    	resizeDuration = 0;
    }
    
    // -----------------------------------------------------------------------------------
    
    //
    //	Additional methods for Element added by SU, Couloir
    //	- further additions by Lokesh Dhakar (huddletogether.com)
    //
    Object.extend(Element, {
    	getWidth: function(element) {
    	   	element = $(element);
    	   	return element.offsetWidth; 
    	},
    	setWidth: function(element,w) {
    	   	element = $(element);
        	element.style.width = w +"px";
    	},
    	setHeight: function(element,h) {
       		element = $(element);
        	element.style.height = h +"px";
    	},
    	setTop: function(element,t) {
    	   	element = $(element);
        	element.style.top = t +"px";
    	},
    	setSrc: function(element,src) {
        	element = $(element);
        	element.src = src; 
    	},
    	setHref: function(element,href) {
        	element = $(element);
        	element.href = href; 
    	},
    	setInnerHTML: function(element,content) {
    		element = $(element);
    		element.innerHTML = content;
    	}
    });
    
    // -----------------------------------------------------------------------------------
    
    //
    //	Extending built-in Array object
    //	- array.removeDuplicates()
    //	- array.empty()
    //
    Array.prototype.removeDuplicates = function () {
        for(i = 0; i < this.length; i++){
            for(j = this.length-1; j>i; j--){        
                if(this[i][0] == this[j][0]){
                    this.splice(j,1);
                }
            }
        }
    }
    
    // -----------------------------------------------------------------------------------
    
    Array.prototype.empty = function () {
    	for(i = 0; i <= this.length; i++){
    		this.shift();
    	}
    }
    
    // -----------------------------------------------------------------------------------
    
    //
    //	Lightbox Class Declaration
    //	- initialize()
    //	- start()
    //	- changeImage()
    //	- resizeImageContainer()
    //	- showImage()
    //	- updateDetails()
    //	- updateNav()
    //	- enableKeyboardNav()
    //	- disableKeyboardNav()
    //	- keyboardNavAction()
    //	- preloadNeighborImages()
    //	- end()
    //
    //	Structuring of code inspired by Scott Upton (http://www.uptonic.com/)
    //
    var Lightbox = Class.create();
    
    Lightbox.prototype = {
    	
    	// initialize()
    	// Constructor runs on completion of the DOM loading. Loops through anchor tags looking for 
    	// 'lightbox' references and applies onclick events to appropriate links. The 2nd section of
    	// the function inserts html at the bottom of the page which is used to display the shadow 
    	// overlay and the image container.
    	//
    	initialize: function() {	
    		if (!document.getElementsByTagName){ return; }
    		var anchors = document.getElementsByTagName('a');
    		var areas = document.getElementsByTagName('area');
    
    		// loop through all anchor tags
    		for (var i=0; i<anchors.length; i++){
    			var anchor = anchors[i];
    			
    			var relAttribute = String(anchor.getAttribute('rel'));
    			
    			// use the string.match() method to catch 'lightbox' references in the rel attribute
    			if (anchor.getAttribute('href') && (relAttribute.toLowerCase().match('lightbox'))){
    				anchor.onclick = function () {myLightbox.start(this); return false;}
    			}
    		}
    
    		// loop through all area tags
    		// todo: combine anchor & area tag loops
    		for (var i=0; i< areas.length; i++){
    			var area = areas[i];
    			
    			var relAttribute = String(area.getAttribute('rel'));
    			
    			// use the string.match() method to catch 'lightbox' references in the rel attribute
    			if (area.getAttribute('href') && (relAttribute.toLowerCase().match('lightbox'))){
    				area.onclick = function () {myLightbox.start(this); return false;}
    			}
    		}
    
    		// The rest of this code inserts html at the bottom of the page that looks similar to this:
    		//
    		//	<div id="overlay"></div>
    		//	<div id="lightbox">
    		//		<div id="outerImageContainer">
    		//			<div id="imageContainer">
    		//				<img id="lightboxImage">
    		//				<div style="" id="hoverNav">
    		//					<a href="#" id="prevLink"></a>
    		//					<a href="#" id="nextLink"></a>
    		//				</div>
    		//				<div id="loading">
    		//					<a href="#" id="loadingLink">
    		//						<img src="images/loading.gif">
    		//					</a>
    		//				</div>
    		//			</div>
    		//		</div>
    		//		<div id="imageDataContainer">
    		//			<div id="imageData">
    		//				<div id="imageDetails">
    		//					<span id="caption"></span>
    		//					<span id="numberDisplay"></span>
    		//				</div>
    		//				<div id="bottomNav">
    		//					<a href="#" id="bottomNavClose">
    		//						<img src="images/close.gif">
    		//					</a>
    		//				</div>
    		//			</div>
    		//		</div>
    		//	</div>
    
    
    		var objBody = document.getElementsByTagName("body").item(0);
    		
    		var objOverlay = document.createElement("div");
    		objOverlay.setAttribute('id','overlay');
    		objOverlay.style.display = 'none';
    		objOverlay.onclick = function() { myLightbox.end(); }
    		objBody.appendChild(objOverlay);
    		
    		var objLightbox = document.createElement("div");
    		objLightbox.setAttribute('id','lightbox');
    		objLightbox.style.display = 'none';
    		objLightbox.onclick = function(e) {	// close Lightbox is user clicks shadow overlay
    			if (!e) var e = window.event;
    			var clickObj = Event.element(e).id;
    			if ( clickObj == 'lightbox') {
    				myLightbox.end();
    			}
    		};
    		objBody.appendChild(objLightbox);
    			
    		var objOuterImageContainer = document.createElement("div");
    		objOuterImageContainer.setAttribute('id','outerImageContainer');
    		objLightbox.appendChild(objOuterImageContainer);
    
    		// When Lightbox starts it will resize itself from 250 by 250 to the current image dimension.
    		// If animations are turned off, it will be hidden as to prevent a flicker of a
    		// white 250 by 250 box.
    		if(animate){
    			Element.setWidth('outerImageContainer', 250);
    			Element.setHeight('outerImageContainer', 250);			
    		} else {
    			Element.setWidth('outerImageContainer', 1);
    			Element.setHeight('outerImageContainer', 1);			
    		}
    
    		var objImageContainer = document.createElement("div");
    		objImageContainer.setAttribute('id','imageContainer');
    		objOuterImageContainer.appendChild(objImageContainer);
    	
    		var objLightboxImage = document.createElement("img");
    		objLightboxImage.setAttribute('id','lightboxImage');
    		objImageContainer.appendChild(objLightboxImage);
    	
    		var objHoverNav = document.createElement("div");
    		objHoverNav.setAttribute('id','hoverNav');
    		objImageContainer.appendChild(objHoverNav);
    	
    		var objPrevLink = document.createElement("a");
    		objPrevLink.setAttribute('id','prevLink');
    		objPrevLink.setAttribute('href','#');
    		objHoverNav.appendChild(objPrevLink);
    		
    		var objNextLink = document.createElement("a");
    		objNextLink.setAttribute('id','nextLink');
    		objNextLink.setAttribute('href','#');
    		objHoverNav.appendChild(objNextLink);
    	
    		var objLoading = document.createElement("div");
    		objLoading.setAttribute('id','loading');
    		objImageContainer.appendChild(objLoading);
    	
    		var objLoadingLink = document.createElement("a");
    		objLoadingLink.setAttribute('id','loadingLink');
    		objLoadingLink.setAttribute('href','#');
    		objLoadingLink.onclick = function() { myLightbox.end(); return false; }
    		objLoading.appendChild(objLoadingLink);
    	
    		var objLoadingImage = document.createElement("img");
    		objLoadingImage.setAttribute('src', fileLoadingImage);
    		objLoadingLink.appendChild(objLoadingImage);
    
    		var objImageDataContainer = document.createElement("div");
    		objImageDataContainer.setAttribute('id','imageDataContainer');
    		objImageDataContainer.className = 'clearfix';
    		objLightbox.appendChild(objImageDataContainer);
    
    		var objImageData = document.createElement("div");
    		objImageData.setAttribute('id','imageData');
    		objImageDataContainer.appendChild(objImageData);
    	
    		var objImageDetails = document.createElement("div");
    		objImageDetails.setAttribute('id','imageDetails');
    		objImageData.appendChild(objImageDetails);
    	
    		var objCaption = document.createElement("span");
    		objCaption.setAttribute('id','caption');
    		objImageDetails.appendChild(objCaption);
    	
    		var objNumberDisplay = document.createElement("span");
    		objNumberDisplay.setAttribute('id','numberDisplay');
    		objImageDetails.appendChild(objNumberDisplay);
    		
    		var objBottomNav = document.createElement("div");
    		objBottomNav.setAttribute('id','bottomNav');
    		objImageData.appendChild(objBottomNav);
    	
    		var objBottomNavCloseLink = document.createElement("a");
    		objBottomNavCloseLink.setAttribute('id','bottomNavClose');
    		objBottomNavCloseLink.setAttribute('href','#');
    		objBottomNavCloseLink.onclick = function() { myLightbox.end(); return false; }
    		objBottomNav.appendChild(objBottomNavCloseLink);
    	
    		var objBottomNavCloseImage = document.createElement("img");
    		objBottomNavCloseImage.setAttribute('src', fileBottomNavCloseImage);
    		objBottomNavCloseLink.appendChild(objBottomNavCloseImage);
    	},
    	
    	//
    	//	start()
    	//	Display overlay and lightbox. If image is part of a set, add siblings to imageArray.
    	//
    	start: function(imageLink) {	
    
    		function getImageTitle(anchor){ //DynamicDrive.com added function that allows the caption("title") to be linked ("rev").
    			var ddimageTitle=anchor.getAttribute('title')
    			var ddimageTitleURL=(ddimageTitle!=null && ddimageTitle!="")? anchor.getAttribute('rev') : null
    			return ddimageTitleFinal=(ddimageTitleURL!=null && ddimageTitleURL!="")? '<a href="'+ddimageTitleURL+'" class="ddcaptionurl">'+ddimageTitle+'</a>' : ddimageTitle
    		};
    
    		hideSelectBoxes();
    		hideFlash();
    
    		// stretch overlay to fill page and fade in
    		var arrayPageSize = getPageSize();
    		Element.setHeight('overlay', arrayPageSize[1]);
    
    		new Effect.Appear('overlay', { duration: overlayDuration, from: 0.0, to: 0.8 });
    
    		imageArray = [];
    		imageNum = 0;		
    
    		if (!document.getElementsByTagName){ return; }
    		var anchors = document.getElementsByTagName('a');
    
    		// if image is NOT part of a set..
    		if((imageLink.getAttribute('rel') == 'lightbox')){
    			// add single image to imageArray
    			imageArray.push(new Array(imageLink.getAttribute('href'), getImageTitle(imageLink)));			
    		} else {
    		// if image is part of a set..
    
    			// loop through anchors, find other images in set, and add them to imageArray
    			for (var i=0; i<anchors.length; i++){
    				var anchor = anchors[i];
    				if (anchor.getAttribute('href') && (anchor.getAttribute('rel') == imageLink.getAttribute('rel'))){
    					imageArray.push(new Array(anchor.getAttribute('href'), getImageTitle(anchor)));
    				}
    			}
    			imageArray.removeDuplicates();
    			while(imageArray[imageNum][0] != imageLink.getAttribute('href')) { imageNum++;}
    		}
    
    		// calculate top offset for the lightbox and display 
    		var arrayPageScroll = getPageScroll();
    		var lightboxTop = arrayPageScroll[1] + (arrayPageSize[3] / 10);
    
    		Element.setTop('lightbox', lightboxTop);
    		Element.show('lightbox');
    		
    		this.changeImage(imageNum);
    	},
    
    	//
    	//	changeImage()
    	//	Hide most elements and preload image in preparation for resizing image container.
    	//
    	changeImage: function(imageNum) {	
    		
    		activeImage = imageNum;	// update global var
    
    		// hide elements during transition
    		if(animate){ Element.show('loading');}
    		Element.hide('lightboxImage');
    		Element.hide('hoverNav');
    		Element.hide('prevLink');
    		Element.hide('nextLink');
    		Element.hide('imageDataContainer');
    		Element.hide('numberDisplay');		
    		
    		imgPreloader = new Image();
    		
    		// once image is preloaded, resize image container
    		imgPreloader.onload=function(){
    			Element.setSrc('lightboxImage', imageArray[activeImage][0]);
    			myLightbox.resizeImageContainer(imgPreloader.width, imgPreloader.height);
    		}
    		imgPreloader.src = imageArray[activeImage][0];
    	},
    
    	//
    	//	resizeImageContainer()
    	//
    	resizeImageContainer: function( imgWidth, imgHeight) {
    
    		// get curren width and height
    		this.widthCurrent = Element.getWidth('outerImageContainer');
    		this.heightCurrent = Element.getHeight('outerImageContainer');
    
    		// get new width and height
    		var widthNew = (imgWidth  + (borderSize * 2));
    		var heightNew = (imgHeight  + (borderSize * 2));
    
    		// scalars based on change from old to new
    		this.xScale = ( widthNew / this.widthCurrent) * 100;
    		this.yScale = ( heightNew / this.heightCurrent) * 100;
    
    		// calculate size difference between new and old image, and resize if necessary
    		wDiff = this.widthCurrent - widthNew;
    		hDiff = this.heightCurrent - heightNew;
    
    		if(!( hDiff == 0)){ new Effect.Scale('outerImageContainer', this.yScale, {scaleX: false, duration: resizeDuration, queue: 'front'}); }
    		if(!( wDiff == 0)){ new Effect.Scale('outerImageContainer', this.xScale, {scaleY: false, delay: resizeDuration, duration: resizeDuration}); }
    
    		// if new and old image are same size and no scaling transition is necessary, 
    		// do a quick pause to prevent image flicker.
    		if((hDiff == 0) && (wDiff == 0)){
    			if (navigator.appVersion.indexOf("MSIE")!=-1){ pause(250); } else { pause(100);} 
    		}
    
    		Element.setHeight('prevLink', imgHeight);
    		Element.setHeight('nextLink', imgHeight);
    		Element.setWidth( 'imageDataContainer', widthNew);
    
    		this.showImage();
    	},
    	
    	//
    	//	showImage()
    	//	Display image and begin preloading neighbors.
    	//
    	showImage: function(){
    		Element.hide('loading');
    		new Effect.Appear('lightboxImage', { duration: resizeDuration, queue: 'end', afterFinish: function(){	myLightbox.updateDetails(); } });
    		this.preloadNeighborImages();
    	},
    
    	//
    	//	updateDetails()
    	//	Display caption, image number, and bottom nav.
    	//
    	updateDetails: function() {
    	
    		Element.show('caption');
    		Element.setInnerHTML( 'caption', imageArray[activeImage][1]);
    		
    		// if image is part of set display 'Image x of x' 
    		if(imageArray.length > 1){
    			Element.show('numberDisplay');
    			Element.setInnerHTML( 'numberDisplay', "Image " + eval(activeImage + 1) + " of " + imageArray.length);
    		}
    
    		new Effect.Parallel(
    			[ new Effect.SlideDown( 'imageDataContainer', { sync: true, duration: resizeDuration, from: 0.0, to: 1.0 }), 
    			  new Effect.Appear('imageDataContainer', { sync: true, duration: resizeDuration }) ], 
    			{ duration: resizeDuration, afterFinish: function() {
    				// update overlay size and update nav
    				var arrayPageSize = getPageSize();
    				Element.setHeight('overlay', arrayPageSize[1]);
    				myLightbox.updateNav();
    				}
    			} 
    		);
    	},
    
    	//
    	//	updateNav()
    	//	Display appropriate previous and next hover navigation.
    	//
    	updateNav: function() {
    
    		Element.show('hoverNav');				
    
    		// if not first image in set, display prev image button
    		if(activeImage != 0){
    			Element.show('prevLink');
    			document.getElementById('prevLink').onclick = function() {
    				myLightbox.changeImage(activeImage - 1); return false;
    			}
    		}
    
    		// if not last image in set, display next image button
    		if(activeImage != (imageArray.length - 1)){
    			Element.show('nextLink');
    			document.getElementById('nextLink').onclick = function() {
    				myLightbox.changeImage(activeImage + 1); return false;
    			}
    		}
    		
    		this.enableKeyboardNav();
    	},
    
    	//
    	//	enableKeyboardNav()
    	//
    	enableKeyboardNav: function() {
    		document.onkeydown = this.keyboardAction; 
    	},
    
    	//
    	//	disableKeyboardNav()
    	//
    	disableKeyboardNav: function() {
    		document.onkeydown = '';
    	},
    
    	//
    	//	keyboardAction()
    	//
    	keyboardAction: function(e) {
    		if (e == null) { // ie
    			keycode = event.keyCode;
    			escapeKey = 27;
    		} else { // mozilla
    			keycode = e.keyCode;
    			escapeKey = e.DOM_VK_ESCAPE;
    		}
    
    		key = String.fromCharCode(keycode).toLowerCase();
    		
    		if((key == 'x') || (key == 'o') || (key == 'c') || (keycode == escapeKey)){	// close lightbox
    			myLightbox.end();
    		} else if((key == 'p') || (keycode == 37)){	// display previous image
    			if(activeImage != 0){
    				myLightbox.disableKeyboardNav();
    				myLightbox.changeImage(activeImage - 1);
    			}
    		} else if((key == 'n') || (keycode == 39)){	// display next image
    			if(activeImage != (imageArray.length - 1)){
    				myLightbox.disableKeyboardNav();
    				myLightbox.changeImage(activeImage + 1);
    			}
    		}
    
    	},
    
    	//
    	//	preloadNeighborImages()
    	//	Preload previous and next images.
    	//
    	preloadNeighborImages: function(){
    
    		if((imageArray.length - 1) > activeImage){
    			preloadNextImage = new Image();
    			preloadNextImage.src = imageArray[activeImage + 1][0];
    		}
    		if(activeImage > 0){
    			preloadPrevImage = new Image();
    			preloadPrevImage.src = imageArray[activeImage - 1][0];
    		}
    	
    	},
    
    	//
    	//	end()
    	//
    	end: function() {
    		this.disableKeyboardNav();
    		Element.hide('lightbox');
    		new Effect.Fade('overlay', { duration: overlayDuration});
    		showSelectBoxes();
    		showFlash();
    	}
    }
    
    // -----------------------------------------------------------------------------------
    
    //
    // getPageScroll()
    // Returns array with x,y page scroll values.
    // Core code from - quirksmode.org
    //
    function getPageScroll(){
    
    	var yScroll;
    
    	if (self.pageYOffset) {
    		yScroll = self.pageYOffset;
    	} else if (document.documentElement && document.documentElement.scrollTop){	 // Explorer 6 Strict
    		yScroll = document.documentElement.scrollTop;
    	} else if (document.body) {// all other Explorers
    		yScroll = document.body.scrollTop;
    	}
    
    	arrayPageScroll = new Array('',yScroll) 
    	return arrayPageScroll;
    }
    
    // -----------------------------------------------------------------------------------
    
    //
    // getPageSize()
    // Returns array with page width, height and window width, height
    // Core code from - quirksmode.org
    // Edit for Firefox by pHaez
    //
    function getPageSize(){
    	
    	var xScroll, yScroll;
    	
    	if (window.innerHeight && window.scrollMaxY) {	
    		xScroll = document.body.scrollWidth;
    		yScroll = window.innerHeight + window.scrollMaxY;
    	} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
    		xScroll = document.body.scrollWidth;
    		yScroll = document.body.scrollHeight;
    	} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
    		xScroll = document.body.offsetWidth;
    		yScroll = document.body.offsetHeight;
    	}
    	
    	var windowWidth, windowHeight;
    	if (self.innerHeight) {	// all except Explorer
    		windowWidth = self.innerWidth;
    		windowHeight = self.innerHeight;
    	} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
    		windowWidth = document.documentElement.clientWidth;
    		windowHeight = document.documentElement.clientHeight;
    	} else if (document.body) { // other Explorers
    		windowWidth = document.body.clientWidth;
    		windowHeight = document.body.clientHeight;
    	}	
    	
    	// for small pages with total height less then height of the viewport
    	if(yScroll < windowHeight){
    		pageHeight = windowHeight;
    	} else { 
    		pageHeight = yScroll;
    	}
    
    	// for small pages with total width less then width of the viewport
    	if(xScroll < windowWidth){	
    		pageWidth = windowWidth;
    	} else {
    		pageWidth = xScroll;
    	}
    
    	arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight) 
    	return arrayPageSize;
    }
    
    // -----------------------------------------------------------------------------------
    
    //
    // getKey(key)
    // Gets keycode. If 'x' is pressed then it hides the lightbox.
    //
    function getKey(e){
    	if (e == null) { // ie
    		keycode = event.keyCode;
    	} else { // mozilla
    		keycode = e.which;
    	}
    	key = String.fromCharCode(keycode).toLowerCase();
    	
    	if(key == 'x'){
    	}
    }
    
    // -----------------------------------------------------------------------------------
    
    //
    // listenKey()
    //
    function listenKey () {	document.onkeypress = getKey; }
    	
    // ---------------------------------------------------
    
    function showSelectBoxes(){
    	var selects = document.getElementsByTagName("select");
    	for (i = 0; i != selects.length; i++) {
    		selects[i].style.visibility = "visible";
    	}
    }
    
    // ---------------------------------------------------
    
    function hideSelectBoxes(){
    	var selects = document.getElementsByTagName("select");
    	for (i = 0; i != selects.length; i++) {
    		selects[i].style.visibility = "hidden";
    	}
    }
    
    // ---------------------------------------------------
    
    function showFlash(){
    	var flashObjects = document.getElementsByTagName("object");
    	for (i = 0; i != flashObjects.length; i++) {
    		flashObjects[i].style.visibility = "visible";
    	}
    
    	var flashEmbeds = document.getElementsByTagName("embeds");
    	for (i = 0; i != flashEmbeds.length; i++) {
    		flashEmbeds[i].style.visibility = "visible";
    	}
    }
    
    // ---------------------------------------------------
    
    function hideFlash(){
    	var flashObjects = document.getElementsByTagName("object");
    	for (i = 0; i != flashObjects.length; i++) {
    		flashObjects[i].style.visibility = "hidden";
    	}
    
    	var flashEmbeds = document.getElementsByTagName("embeds");
    	for (i = 0; i != flashEmbeds.length; i++) {
    		flashEmbeds[i].style.visibility = "hidden";
    	}
    
    }
    
    
    // ---------------------------------------------------
    
    //
    // pause(numberMillis)
    // Pauses code execution for specified time. Uses busy code, not good.
    // Help from Ran Bar-On [ran2103@gmail.com]
    //
    
    function pause(ms){
    	var date = new Date();
    	curDate = null;
    	do{var curDate = new Date();}
    	while( curDate - date < ms);
    }
    /*
    function pause(numberMillis) {
    	var curently = new Date().getTime() + sender;
    	while (new Date().getTime();	
    }
    */
    // ---------------------------------------------------
    
    
    
    function initLightbox() { myLightbox = new Lightbox(); }
    Event.observe(window, 'load', initLightbox, false);

  12. #12
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hmm ... it's not likely to be that one, since line 33 is a comment.

    If you have Firefox or Opera, try loading the page in one of them and then check the error console (Tools->Error Console in FF, Tools->Advanced->Error Console in Opera). If there's an error it might show up there, and those two give you a lot more helpful information than IE does.
    Birnam wood is come to Dunsinane

  13. #13
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I've not used it yet but someone brought the IE Developer toolbar to my attention. I usually use the script debugger to deal with issues like this but I think that could confuse you, alot.

    See whether it helps or not? http://www.microsoft.com/downloads/d...displaylang=en

    Actually, i've just tested it and it doesn't look like it does anything with Javascript as far as debugging. Unfortunately it seems you will need to use either Visual Studio or Script Debugger (download) to find whats causing the error.


  14. #14
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Is it possible that prototype doesn't like being loaded twice, and is causing problems due to that?
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  15. #15
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I thought about that, but the error message doesn't indicate that this is the problem. Besides, I think Prototype is written in a way that doesn't cause such conflicts.
    Error: Object doesn't support this property or method
    Birnam wood is come to Dunsinane

  16. #16
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I suppose the only way forward is to ask for an url to an example of the error so we can investigate it further?


  17. #17
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have since rewritten a part of the site so this problem should have gone but a similar one may return when I do the next part but I will keep you updated.

    Thanks

    Regards,
    Neil


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
  •