CSS Codes
CSS Layouts
Results 1 to 5 of 5

Thread: Now, I need Help with DIV tags!!!

  1. 10-13-2006, 04:28 PM #1
    sbmhome
    sbmhome is offline Junior Coders
    Join Date
    Oct 2006
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Now, I need Help with DIV tags!!!

    I am able to make DIV tags appear and disappear my question is as follows.

    I have a lot of DIV tags that I want to sort. It takes a bit of time for the sorting to occur.

    I want to throw up an "updating page...please wait message", while this is occuring...the problem is that the page doesn't allow the message to render!

    I think this is occuring because even though the DIV's are being moved around, the screen only refreshes once the sort is done (which is when I remove the "updating page" message...so it never shows up).

    How can i force one DIV element to show on the page, while the sort is still going on?

    Any help will be great appreciated.
    Reply With Quote Reply With Quote
  2. 10-13-2006, 05:58 PM #2
    djr33's Avatar
    djr33
    djr33 is offline Global Moderator
    Join Date
    Mar 2006
    Location
    Illinois, USA
    Posts
    12,164
    Thanks
    265
    Thanked 690 Times in 678 Posts

    Default

    Not really sure, but you'd need to post the source for someone to be able to help....
    Daniel - Freelance Web Design | <?php?> | <html>| español | Deutsch | italiano | português | català | un peu de français | some knowledge of several other languages: I can sometimes help translate here on DD | Linguistics Forum
    Reply With Quote Reply With Quote
  3. 10-13-2006, 07:26 PM #3
    sbmhome
    sbmhome is offline Junior Coders
    Join Date
    Oct 2006
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    <script>
    function showObject(obj){
    var el = document.getElementById(obj);
    el.style.display = '';
    }
    function hideObject(obj){
    var el = document.getElementById(obj);
    el.style.display = 'none';
    }




    function changeBackgroundColors(){
    //Show update image
    showObject('updateMessageDIV');



    //do some kind of work
    for (i = 0; i < 3; i++){

    // alert("See...Now the pic showed up!"); //Uncomment this alert to see the PIC!
    if (float1.style.background =="red"){
    backGroundColor ="green";

    } else{
    backGroundColor ="red";
    }

    float1.style.background = backGroundColor;

    }

    //hide Update image
    hideObject('updateMessageDIV');

    }

    </script>


    <style type="text/css">

    #float1 {width:200px;margin: 0 auto;background: #FFFFFF;padding-top:2px; padding-bottom:2px;padding-left:3px; padding-right:3px;

    top:100px;
    position:absolute;left:200px;z-index:200000;}
    </style>

    <html>
    <body>
    This shows that my show and hide functions work:<br>
    <a href="#" onclick="showObject('updateMessageDIV');"> showOjbect</a>
    <a href="#" onclick="hideObject('updateMessageDIV');"> hideOjbect</a><br><br>

    This starts the Test of the below text
    <a href="#" onclick="changeBackgroundColors();"> change background colors</a>



    <div id="float1">
    The background for this text will change
    </div>

    <br><br><br><br><br><br><br><br>

    To check this out correcty


    Yahoo Image below:<br>
    <div id="updateMessageDIV" style="display:none;">
    <img src="http://us.i1.yimg.com/us.yimg.com/i/ww/beta/y3.gif">
    </div>


    <br>
    1. The Yahoo image SHOULD appear before the color changes<br>
    2. To see that this is the case, uncomment the "alert" in the changeBackgroundColors() function.
    </body>
    </html>
    Reply With Quote Reply With Quote
  4. 10-13-2006, 07:27 PM #4
    sbmhome
    sbmhome is offline Junior Coders
    Join Date
    Oct 2006
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    SAVE THE BELOW FILE AND OPEN IT IN A BROWSER....THANKS GUYS!


    Quote Originally Posted by sbmhome
    <script>
    function showObject(obj){
    var el = document.getElementById(obj);
    el.style.display = '';
    }
    function hideObject(obj){
    var el = document.getElementById(obj);
    el.style.display = 'none';
    }




    function changeBackgroundColors(){
    //Show update image
    showObject('updateMessageDIV');



    //do some kind of work
    for (i = 0; i < 3; i++){

    // alert("See...Now the pic showed up!"); //Uncomment this alert to see the PIC!
    if (float1.style.background =="red"){
    backGroundColor ="green";

    } else{
    backGroundColor ="red";
    }

    float1.style.background = backGroundColor;

    }

    //hide Update image
    hideObject('updateMessageDIV');

    }

    </script>


    <style type="text/css">

    #float1 {width:200px;margin: 0 auto;background: #FFFFFF;padding-top:2px; padding-bottom:2px;padding-left:3px; padding-right:3px;

    top:100px;
    position:absolute;left:200px;z-index:200000;}
    </style>

    <html>
    <body>
    This shows that my show and hide functions work:<br>
    <a href="#" onclick="showObject('updateMessageDIV');"> showOjbect</a>
    <a href="#" onclick="hideObject('updateMessageDIV');"> hideOjbect</a><br><br>

    This starts the Test of the below text
    <a href="#" onclick="changeBackgroundColors();"> change background colors</a>



    <div id="float1">
    The background for this text will change
    </div>

    <br><br><br><br><br><br><br><br>

    To check this out correcty


    Yahoo Image below:<br>
    <div id="updateMessageDIV" style="display:none;">
    <img src="http://us.i1.yimg.com/us.yimg.com/i/ww/beta/y3.gif">
    </div>


    <br>
    1. The Yahoo image SHOULD appear before the color changes<br>
    2. To see that this is the case, uncomment the "alert" in the changeBackgroundColors() function.
    </body>
    </html>
    Reply With Quote Reply With Quote
  5. 10-13-2006, 10:52 PM #5
    sbmhome
    sbmhome is offline Junior Coders
    Join Date
    Oct 2006
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Ok...I've found the solution

    Looks like I found the solution....

    Assuming "showobject" and "hideObject" are not called inside of the changeBackgroundColors() function

    This is what I was trying before and it won't work....
    showObject('updateMessageDIV');
    changeBackgroundColors();
    hideObject('updateMessageDIV');

    the trick is to call the functions like this ().

    showObject('updateMessageDIV');
    timerID=setTimeout('changeBackgroundColors()',1);
    hideObject('updateMessageDIV');

    Hope someone else finds this useful.
    Reply With Quote Reply With Quote
« Previous Thread | Next Thread »

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
  •  

Forum Rules