Page 3 of 4 FirstFirst 1234 LastLast
Results 21 to 30 of 31

Thread: body onload

  1. #21
    Join Date
    Sep 2005
    Location
    India
    Posts
    1,625
    Thanks
    6
    Thanked 107 Times in 107 Posts

    Default

    @chechu, Two problems :

    (1) Though you've used absolute positioning you haven't mentioned any values for 'top' and 'left', I wonder what is the purpose of using absolute positioning without using those two properties?

    (2) The demo page you mentioned in your initial postings doesn't show any loading image for me. I think if you can attach your page with JS, images, CSS, etc it would be good for us to check. Because it seems that you are saying something we are experiencing something else and it is really difficult to achieve the result quickly.

  2. #22
    Join Date
    Jul 2006
    Location
    Antwerp, Belgium (Europe)
    Posts
    864
    Thanks
    107
    Thanked 2 Times in 2 Posts

    Default

    http://www.hetbestevoordeel.be/andertest.html
    Here's the result.
    Though you've used absolute positioning you haven't mentioned any values for 'top' and 'left', I wonder what is the purpose of using absolute positioning without using those two properties?
    I thought 'absolute' means that it is placed in the middle, and that 'margin-left' and '-right' placing 'auto' confirms this ...

  3. #23
    Join Date
    Sep 2005
    Location
    India
    Posts
    1,625
    Thanks
    6
    Thanked 107 Times in 107 Posts

    Default

    1. Insert the following CSS into the page. Comment the current definition:

    Code:
    #loading{
    margin:0px auto;
    background: #ffffff; 
    font-family: tahoma;
    font-size: 11px;
    color: #456a96;
    }
    2. In your page change the following element 'display' property like the way I've done following:

    Code:
    <div id="loading"> <!-- Removed the 'display:none;' from here -->
    Code:
    <div id="content" style="display: none;">  <!-- changed 'inline' to 'none' here -->
    3. Change the window's onload event handler to the following manner:
    Code:
    window.onload = function(){
    	if(document.getElementById('loading') && document.getElementById('content')){
    		document.getElementById('loading').style.display = 'none';
    		document.getElementById('content').style.display = 'block';		
    	}
    	addListGroupOnDomReady(); //This calls the function available in the config.js	
    }
    4. Add the following line

    Code:
    initListGroup('chainedmenu', document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel, document.listmenu0.fourthlevel, 'saveit');
    As the last line in 'config.js''s 'addListGroupOnDomReady' function.

    5. Save all the files and reloads the page.

  4. #24
    Join Date
    Jul 2006
    Location
    Antwerp, Belgium (Europe)
    Posts
    864
    Thanks
    107
    Thanked 2 Times in 2 Posts

    Default

    I adjusted the html of the page, and the .js
    Code:
    <style type="text/css">
    #loading{
    margin:0px auto;
    background: #ffffff; 
    font-family: tahoma;
    font-size: 11px;
    color: #456a96;
    }
    </style>
    <script type="text/javascript">
    window.onload = function(){
    	if(document.getElementById('loading') && document.getElementById('content')){
    		document.getElementById('loading').style.display = 'none';
    		document.getElementById('content').style.display = 'block';		
    	}
    	addListGroupOnDomReady(); //This calls the function available in the config.js	
    }
    </script>
    </head>
    <center>
    <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
    <div id="loading">
    <center>
    <img src="images/header.jpg" style="border: 0px; text-align:center; margin-top:1px;">
    <p align=center><b>HET BESTE VOORDEEL</b>
    <p align=center>Win dagtickets in de Aqua Mundo in CenterParcs Erperheide
    <p align=center><br>&nbsp;<br><img src="images/loader.gif" style="border: 0px;">
    </center>
    </div>
    <div id="content" style="display: none;">
    But I doubt abou the .js Is this correct:
    Code:
    function addListGroupOnDomReady() {
    addListGroup("chainedmenu", "First-Select");
    initListGroup('chainedmenu', document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel, document.listmenu0.fourthlevel, 'saveit');

  5. #25
    Join Date
    Sep 2005
    Location
    India
    Posts
    1,625
    Thanks
    6
    Thanked 107 Times in 107 Posts

    Default

    Chechu the following line should be the last line of 'addListGroupOnDomReady' function which is in 'config.js'

    Code:
    initListGroup('chainedmenu', document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel, document.listmenu0.fourthlevel, 'saveit');

  6. #26
    Join Date
    Sep 2007
    Location
    The Netherlands
    Posts
    1,734
    Thanks
    46
    Thanked 216 Times in 209 Posts
    Blog Entries
    53

    Default

    Chechu, the following works for me. This (and nothing else) in the head
    Code:
    <script language="javascript" src="chainedmenu.js">
    
    /***********************************************
    * Chained Select Menu- By Xin Yang (http://www.yxscripts.com/) & Dynamic Drive 
    
    (http://dynamicdrive.com)
    * Script featured on/available at http://www.dynamicdrive.com/
    * Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
    * This notice must stay intact for legal use!
    ***********************************************/
    
    </script>
    <script language="javascript" src="config.js"></script>
    
    <script type="text/javascript">
    function onloadLoading(){
    document.getElementById('loading').style.display='none';
    }
    
    function onloadContent(){
    document.getElementById('content').style.display='inline';
    }
    
    function onloadChained(){
    initListGroup('chainedmenu', document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel, 'saveit');
    }
    </script>
    
    <script type="text/javascript">
    /*found at http://simonwillison.net/2004/May/26/addLoadEvent*/
    function addLoadEvent(func) {
        var oldonload = window.onload;
        if (typeof window.onload != 'function') {
            window.onload = func;
        } else {
            window.onload = function() {
                if (oldonload) {
                    oldonload();
                }
                func();
            }
        }
    }
    addLoadEvent(function() {
        onloadLoading();onloadContent();onloadChained();})
    
    </script>
    After that, no onload in the body. Just <body>
    ===
    Arie.
    Last edited by molendijk; 09-02-2008 at 12:42 PM. Reason: Correction

  7. #27
    Join Date
    Jul 2006
    Location
    Antwerp, Belgium (Europe)
    Posts
    864
    Thanks
    107
    Thanked 2 Times in 2 Posts

    Default

    Codeexploiter: I changed the .js into this, and still doesn't work
    Code:
    var newwindow = 1 //Open links in new window or not? 1=yes, 0=no.
    function addListGroupOnDomReady() {
    initListGroup('chainedmenu', document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel, document.listmenu0.fourthlevel, 'saveit');
    
    	addOption("First-Select", "Kies ...
    The yellow error symbol comes up, and no select items

    Molendijk: with your coding the yellow symbol does noit come up, but the select items don't show up either

  8. #28
    Join Date
    Sep 2005
    Location
    India
    Posts
    1,625
    Thanks
    6
    Thanked 107 Times in 107 Posts

    Default

    Chechu from the code you've provided in your last post it is clear that you haven't followed my instructions I've asked you to insert the 'initListGroup' function call as the last statement in 'addListGroupOnDomReady' function.

    If you look the config.js file I've provided earlier it is clear that the 'addListGroupOnDomReady' is contains large number of programming statements in it. If you call 'initListGroup' function before executing the lines in the 'addListGroupOnDomReady' this script will not work as it should.

    I've attached a new 'config.js' file so use that instead of my previous file. You can find the difference between those files easily.

    Also you need to make a change in 'chainedmenu.js' like the following manner. I've highlighted the part that you need to add in the following function

    Code:
    function initListGroup(n) {
      var _content=cs_findContent(n), count=0;
      if (_content!=null) {
        var content=new cs_contentOBJ("cs_"+n,_content.menu);
        cs_content[cs_content.length]=content;
    
        for (var i=1; i<initListGroup.arguments.length; i++) {
          if (typeof(arguments[i])=="object" && arguments[i].tagName && arguments[i].tagName=="SELECT") {
            content.lists[count]=arguments[i];
    
            arguments[i].onchange=cs_updateList;
            arguments[i].content=content; arguments[i].idx=count++;
          }
          else if (typeof(arguments[i])=="string" && /^[a-zA-Z_]\w*$/.test(arguments[i])) {
            content.cookie=arguments[i];
          }
        }
    
        if (content.lists.length>0) {
          cs_initListGroup(content,content.cookie);
        }
      }
    }
    I've done these tests in a copy of your page and it works for me in both IE and FF.

    Hope this helps.
    Last edited by codeexploiter; 09-03-2008 at 03:41 AM.

  9. The Following User Says Thank You to codeexploiter For This Useful Post:

    chechu (09-03-2008)

  10. #29
    Join Date
    Jul 2006
    Location
    Antwerp, Belgium (Europe)
    Posts
    864
    Thanks
    107
    Thanked 2 Times in 2 Posts

    Default

    It works indeed wonderfully !!!!
    Thank you so much.

  11. #30
    Join Date
    Sep 2005
    Location
    India
    Posts
    1,625
    Thanks
    6
    Thanked 107 Times in 107 Posts

    Default

    Glad that it finally worked

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
  •