Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 2 of 2 FirstFirst 12
Results 16 to 23 of 23
  1. #16
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,554
    Thanks
    80
    Thanked 4,620 Times in 4,583 Posts
    Oh, DOH. I should have read more carefully!
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  2. #17
    Senior Coder
    Join Date
    Apr 2011
    Location
    London, England
    Posts
    2,120
    Thanks
    15
    Thanked 354 Times in 353 Posts
    @rnd me
    when you append an element to the fragment, it disappears from the nodeList...
    Isn't this only true if you actually append the fragment? I suppose I could build a test page

    But, of course, there is not much point in building a fragment if we are not going to append it. Well, I suppose, there may be circumstances where we need to abandon the fragment.
    "I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
    Validate your HTML and CSS

  3. #18
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,554
    Thanks
    80
    Thanked 4,620 Times in 4,583 Posts
    Here. Tested in Chome on http://localhost with cross browser scripting allowed. It works.
    Code:
    <!DOCTYPE html>
    <Html>
    <body>
    <iframe id="fromHere" src="http://www.hse.gov.uk/horizons/sfreports.htm" 
     style="width: 100%; height: 200px; display: none;" onload="copyLIs(this)"></iframe>
    
    <ul id="putItHere"></ul>
    
    <script type="text/javascript">
    function copyLIs(iframe)
    {
          var items = ( iframe.contentWindow || iframe.contentDocument );
          if ( items.document ) items = items.document;
          items = items.getElementsByClassName("itemThumbBook")[0].getElementsByTagName("li");
          var newul = document.getElementById("putItHere");
          for ( var i = 0; i < 3; ++i )
          {
              newul.appendChild(items[Math.floor(Math.random() * items.length)]);
          }
    }
    </script>
    </body>
    </html>
    Last edited by Old Pedant; 01-31-2013 at 12:58 AM.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  4. #19
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,554
    Thanks
    80
    Thanked 4,620 Times in 4,583 Posts
    (I kept banging my head against the wall wondering why it didn't work until I removed the display: none from the <iframe> and realize that the iframe contents hadn't loaded yet! DOH!)

    And while it won't work as coded in older MSIE, because they don't support getElementsByClassName, just add an id to the <ul> in the "sfreports.htm" page and use getElementById() and all is well.

    That is, change
    Code:
    <ul class="itemThumbBook">
    to (say)
    Code:
    <ul class="itemThumbBook" id="itemThumbBook">
    and then change the line
    Code:
          items = items.getElementsByClassName("itemThumbBook")[0].getElementsByTagName("li");
    to
    Code:
          items = items.getElemenById("itemThumbBook").getElementsByTagName("li");
    Last edited by Old Pedant; 01-31-2013 at 01:30 AM.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  5. #20
    New Coder
    Join Date
    Aug 2008
    Location
    Liverpool
    Posts
    53
    Thanks
    37
    Thanked 0 Times in 0 Posts
    @Old Pedant, @sunfighter, @rnd me, @AndrewGSW - apologies for the late reply, I've been away on holiday in not so sunny (very snowy) Edinburgh!

    @rnd me - Your Cross-origin resource sharing (CORS) solution was exactly what I was looking for, however, I have discovered that JAWS only reads the javascript generated list items, and not all list items on the page, so no need to dynamically pull in the 25 reports from another page. Many thanks for your suggestion again.

    The following code is working pretty well, but occasionally it only displays 2 list items; it should display 3. I'm not sure, but maybe using a while loop until the number of ID randoms set to show is 3 might work... any ideas???

    Code:
    <script type="text/javascript">
    this.randomtip = function(){
    var length = $("#random li").length;
    for($i = 0; $i < 3; $i++)
    {
    	var ran = Math.floor(Math.random()*length) + 1;
    	$("#random li:nth-child(" + ran + ")").show();
    }
    };
    $(document).ready(function(){
    	randomtip();
    });
    </script>
    The CSS:
    Code:
    #random li{
    	display:none;
    	}

    If I can get this to work properly, we'd like to use it in our framework; the bonus would be if developers could choose the number of <li> so this can be used on various projects in the future.

    As always, I am very grateful for any suggestions, and continue to be amazed by the generosity of everyone on this forum.

    Many Thanks

    snarf1974

  6. #21
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,554
    Thanks
    80
    Thanked 4,620 Times in 4,583 Posts
    Well, I warned about only getting 2 different values (and it's even possible to get only 1).

    There is nothing in that code that prevents the random number picker from picking the same number twice (or three times).

    So maybe this:
    Code:
    <script type="text/javascript">
    this.randomtip = function()
    {
        var length = $("#random li").length;
        // create an array of numbers corresponding to the <li> elements (1 thru n)
        var i, picks = [];
        for ( i = 1; i <= length; ++i )
        {
            picks[i] = i;
        }
            
        for( i = 0; i < 3; ++i ) // 3 can instead be any number up to 25
        {
            // pick a number from the 1-25 array of numbers
    	var pick = picks [ Math.floor(Math.random()*picks.length) ];
            // show that one
    	$("#random li:nth-child(" + pick + ")").show();
            // remove that number from the list of numbers, so it can't be picked again!
            picks.splice( pick, 1 ); 
        }
    };
    $(document).ready(function(){
    	randomtip();
    });
    </script>
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  7. #22
    New Coder
    Join Date
    Aug 2008
    Location
    Liverpool
    Posts
    53
    Thanks
    37
    Thanked 0 Times in 0 Posts
    Thanks @Old Pedant, I'm still getting the odd time when 2 list items, and even just 1 list item are being displayed?!!?? :-/

  8. #23
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,554
    Thanks
    80
    Thanked 4,620 Times in 4,583 Posts
    Whoops!

    I forgot the picks[3] == 4, and so on!

    Need to modify that!
    Code:
        for ( i = 0; i < 25; ++i )
        {
            picks[i] = i+1;
        }
        for( i = 0; i < 3; ++i ) // 3 can instead be any number up to 25
        {
            // pick a number from the 1-25 array of numbers
    	var pick = Math.floor(Math.random()*picks.length);
            // show that one
    	$("#random li:nth-child(" + picks[pick] + ")").show();
            // remove that number from the list of numbers, so it can't be picked again!
            picks.splice( pick, 1 ); 
        }
    Here's a simple test script that shows that the concept works:
    Code:
    <script type="text/javascript">
    var i, picks = [ ];
    for ( i = 0; i < 25; ++i )
    {
        picks[i] = i+1;
    }
    for ( i = 0; i < 25; ++i )
    {
        pick = Math.floor(Math.random()*picks.length);
        var pnum = picks[pick];
        picks.splice( pick, 1 );
        document.write( "element " + pick + " picked, has value " + pnum + " :: remaining: "  + picks + "<br/>");
    }
        
    </script>
    Run that several times in succession. You will see that the *value* picked never repeats during a run, even when we pick all the available numbers.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


 
Page 2 of 2 FirstFirst 12

Tags for this Thread

Posting Permissions

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