Results 1 to 3 of 3

Thread: Tab Content like script for random visibility?

  1. #1
    Join Date
    Jun 2005
    Posts
    63
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Tab Content like script for random visibility?

    1) Script Title: Tab Content Script

    2) Script URL (on DD):
    http://www.dynamicdrive.com/dynamici...tabcontent.htm

    3) Describe problem:
    I have a request for a script, and I couldn't find anywhere to post it or send it. I'm looking for something like the tab content script, except that, instead of the user choosing what content to show by selecting a tab, instead there are no tabs, and the content to be shown is selected randomly everytime the user loads/refreshes the page.

    A cool addition would be that, and I don't know if this is possible, but, if the user comes to the page from a search, then the range of content to be displayed would be restricted to the content pages containing the data that was searched for, so that a content close (closest?) to that of the data searched for is shown. IOW, if the user was searching for dogs, and the example page was found in the course of the search, then the content associated with the Dog tab would be displayed.

    The useful thing about this script is that, as I understand how they work, this would be a very search engine friendly method.

    In my case, I have a table row that displays ads, and I have several different combinations of ads ready to be displayed in that space. I would like to be able to set it up so that the ads that are shown in the space are randomly chosen.

    In this case it would look something like this:

    Code:
    <DIV class="tabcontentstyle">
    <div id="tcontent1" class="tabcontent">
    Ads row 1
    </div>
    
    <div id="tcontent2" class="tabcontent">
    Ads row 2
    </div>
    
    <div id="tcontent3" class="tabcontent">
    Ads row 3
    </div>
    </DIV>
    
    <script>  display a randomly selected DIV from those above</script>
    Any takers?

    Well, it's an idea, anyway. I assume it has been done before?

    Thanks,

    Thomas
    www.flyingscool.com
    Last edited by Wildfire563; 08-30-2006 at 06:52 AM.

  2. #2
    Join Date
    Aug 2004
    Posts
    10,143
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    Sure, to create a script that randomly displays one of the DIV content blocks, you would use the below script:

    Code:
    <style type="text/css">
    
    .tabcontentstyle{ /*style of tab content oontainer*/
    border: 1px solid gray;
    width: 450px;
    margin-bottom: 1em;
    padding: 10px;
    }
    
    .tabcontent{
    display:none;
    }
    
    </style>
    
    <div id="contentblock" class="tabcontentstyle">
    
    <div class="tabcontent">
    Tab content 1 here<br />Tab content 1 here<br />
    </div>
    
    <div class="tabcontent">
    Tab content 2 here<br />Tab content 2 here<br />
    </div>
    
    <div class="tabcontent">
    Tab content 3 here<br />Tab content 3 here<br />
    </div>
    
    <div class="tabcontent">
    Tab content 4 here<br />Tab content 4 here<br />
    </form>
    </div>
    
    </div>
    
    <script>
    
    function initializetabcontent(){
    var divref=[]
    for (var i=0; i<arguments.length; i++){ //loop through passed DIV container ids
    var alldivs=document.getElementById(arguments[i]).getElementsByTagName("div")
    for (var x=0; x<alldivs.length; x++){
    if (alldivs[x].className=="tabcontent")
    divref[divref.length]=alldivs[x]
    }
    var randomdivpointer=Math.floor(Math.random()*alldivs.length)
    if (divref.length>0)
    alldivs[randomdivpointer].style.display="block"
    }
    }
    
    initializetabcontent("contentblock")
    
    </script>

  3. #3
    Join Date
    Jun 2005
    Posts
    63
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks, that works awesome.

    I added the following to the script

    /***********************************************
    * Random Content Box Display - &#169; Dynamic Drive (www.dynamicdrive.com)
    * This notice must stay intact for legal use.
    * Visit http://www.dynamicdrive.com/ for full source code
    ***********************************************/

    Since I am unfamiliar with how this is normally done, do you think this is a reasonably efficient method to accomplish this task? What are the advantages/disadvantages and other options?

    This isn't super necessary, but is there anyway to preload the randomizer to ignore the last choice so you don't get repeats?

    Thanks again,

    Thomas

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
  •