PDA

View Full Version : Tab Content like script for random visibility?



Wildfire563
08-30-2006, 06:46 AM
1) Script Title: Tab Content Script

2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex17/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:



<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

ddadmin
08-30-2006, 06:48 PM
Sure, to create a script that randomly displays one of the DIV content blocks, you would use the below script:


<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>

Wildfire563
08-30-2006, 08:29 PM
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