Results 1 to 9 of 9

Thread: Free Domain Tab Menu - Whois, Transfer, Search

  1. #1
    Join Date
    Jun 2009
    Location
    Australia
    Posts
    41

    Smile Free Domain Tab Menu - Whois, Transfer, Search

    I've noticed a few people requesting a tab menu that would allow their customers to search for a domain, transfer a domain, and whois a domain with one click.

    After a bit of research, I found out that there was nothing similar offered, just a few suggestions that didn't get me far.

    The simple domain search form that is available right now, you can find in your WHMCS manager, under "Utilities > Integration."

    Hence...

    http://koowii.com/example-demos/searchtab.html

    It will require some tweaking, the design will need to be modified, if you want something a bit more sophisticated.

    You will also need to change the address to where the forms are submitted.

    The option boxes will also have to be changed to the ones that you currently allow customers to purchase.

    I'm not going to make a big instruction manual, I think that most people who are interested in doing something similar will find this useful.

    Steal the code. Enjoy.

    Feel free to visit the Koowii website. Thanks.
    Kind Regards,
    Rachael
    Nerdster Web Hosting

  2. #2
    Join Date
    Mar 2007
    Posts
    43

    Default

    Quote Originally Posted by KooWii View Post
    I've noticed a few people requesting a tab menu that would allow their customers to search for a domain, transfer a domain, and whois a domain with one click.

    After a bit of research, I found out that there was nothing similar offered, just a few suggestions that didn't get me far.

    The simple domain search form that is available right now, you can find in your WHMCS manager, under "Utilities > Integration."

    Hence...

    http://koowii.com/example-demos/searchtab.html

    It will require some tweaking, the design will need to be modified, if you want something a bit more sophisticated.

    You will also need to change the address to where the forms are submitted.

    The option boxes will also have to be changed to the ones that you currently allow customers to purchase.

    I'm not going to make a big instruction manual, I think that most people who are interested in doing something similar will find this useful.

    Steal the code. Enjoy.

    Feel free to visit the Koowii website. Thanks.
    how can i get that?

  3. #3
    Join Date
    May 2009
    Location
    uk
    Posts
    953

    Default

    Code:
    <script type="text/javascript" src="tabcontent.js">
    
    /***********************************************
    * Tab Content script v2.2- � Dynamic Drive DHTML code library (www.dynamicdrive.com)
    * This notice MUST stay intact for legal use
    * Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
    ***********************************************/
    
    </script>
    
    
    <style type="text/css">
    #simple-tabs{margin:0;padding:0;overflow:hidden;margin-bottom:10px;}
    #simple-tabs li a:hover{}
    #simple-tabs li a:visited{color:#fff;text-decoration:none;}
    #simple-tabs li a{font-size:11px;font-weight:bold;color:#fff;display:block;float:left;background:#426397;margin-right:10px;
    padding:0px 8px;line-height:25px;text-decoration:none;}
    #simple-tabs li{display:inline}
    #simple-tabs li a.selected{background:green}
    
    </style>
    
    
    
        
    
    <ul id="simple-tabs">
    <li><a href="#" rel="simple-tabs-1" class="selected">Domain</a></li>
    <li><a href="#" rel="simple-tabs-2">Whois</a></li>
    <li><a href="#" rel="simple-tabs-3">Transfer</a></li>
    </ul>
    
    
    <div id="simple-tabs-1" class="tabcontent">
    <form target="_blank" action="your doman to whmcs/domainchecker.php" method="post">
    
    <input type="hidden" name="token" value="find this in admin" /> 
    <input type="hidden" name="direct" value="true"> 
    <input type="text" name="domain" size="40" class="search-field" value="Domain.." onfocus="if(this.value == 'Domain..') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Domain..';}"/> 
    <select name="ext" class="head-select">
    <option>.com</option>
    <option>.net</option>
    <option>.info</option>
    <option>.org</option>
    <option>.me</option>
    <option>.us</option>
    <option>.mobi</option>
    
    <option>.la</option>
    <option>.asia</option>
    <option>.biz</option>
    <option>.com.tw</option>
    <option>.tw</option>
    <option>.org.tw</option>
    <option>.idv.tw</option>
    <option>.ca</option>
    <option>.cn</option>
    
    <option>.eu</option>
    <option>.name</option>
    <option>.cc</option>
    <option>.ac</option>
    <option>.io</option>
    <option>.sh</option>
    <option>.tv</option>
    <option>.bz</option>
    <option>.nu</option>
    
    <option>.ws</option>
    <option>.kids.us</option>
    <option>.com.cn</option>
    <option>.net.cn</option>
    <option>.org.cn</option>
    <option>.de</option>
    <option>.be</option>
    <option>.tc</option>
    <option>.vg</option>
    
    <option>.ms</option>
    <option>.gs</option>
    <option>.jp</option>
    <option>.net.nz</option>
    <option>.co.nz</option>
    <option>.org.nz</option>
    <option>.in</option>
    <option>.at</option>
    <option>.am</option>
    
    <option>.nl</option>
    <option>.fm</option>
    <option>.com.au</option>
    <option>.net.au</option>
    </select>
    <input type="submit" value="submit" class="search-go"> 
    </form>
    </div>
    
    
    <div id="simple-tabs-2" class="tabcontent"  style="display:none">
    <form target="_blank" action="your doman to whmcs/whois.php" method="post">
    <input type="text" id="domain1" onchange="document.getElementById('domain').value=document.getElementById('domain1').value + '' + document.getElementById('tld').value;" name="domain1" size="40" class="search-field" value="Whois.." onfocus="if(this.value == 'Whois..') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Whois..';}"/> 
    
    <select name="tld" id="tld" onchange="document.getElementById('domain').value=document.getElementById('domain1').value + ' ' + document.getElementById('tld').value;" class="head-select">
    <option>.com</option>
    <option>.net</option>
    <option>.info</option>
    <option>.org</option>
    <option>.me</option>
    <option>.us</option>
    <option>.mobi</option>
    <option>.la</option>
    
    <option>.asia</option>
    <option>.biz</option>
    <option>.com.tw</option>
    <option>.tw</option>
    <option>.org.tw</option>
    <option>.idv.tw</option>
    <option>.ca</option>
    <option>.cn</option>
    <option>.eu</option>
    
    <option>.name</option>
    <option>.cc</option>
    <option>.ac</option>
    <option>.io</option>
    <option>.sh</option>
    <option>.tv</option>
    <option>.bz</option>
    <option>.nu</option>
    <option>.ws</option>
    
    <option>.kids.us</option>
    <option>.com.cn</option>
    <option>.net.cn</option>
    <option>.org.cn</option>
    <option>.de</option>
    <option>.be</option>
    <option>.tc</option>
    <option>.vg</option>
    <option>.ms</option>
    
    <option>.gs</option>
    <option>.jp</option>
    <option>.net.nz</option>
    <option>.co.nz</option>
    <option>.org.nz</option>
    <option>.in</option>
    <option>.at</option>
    <option>.am</option>
    <option>.nl</option>
    
    <option>.fm</option>
    <option>.com.au</option>
    <option>.net.au</option>
    </select>
    <input type="hidden" name="domain" id="domain" value="" />
    <input type="submit" value="submit" class="search-go"> 
    </form>
    </div>
    
    
    <div id="simple-tabs-3" class="tabcontent"  style="display:none">
    <form target="_blank" action="your doman to whmcs/cart.php?a=add&domain=transfer" method="post">
    <input type="text" name="sld" size="40" class="search-field" value="Transfer.." onfocus="if(this.value == 'Transfer..') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Transfer..';}"/> 
    <select name="tld" class="head-select">
    
    <option>.com</option>
    <option>.net</option>
    <option>.info</option>
    <option>.org</option>
    <option>.me</option>
    <option>.us</option>
    <option>.mobi</option>
    <option>.la</option>
    <option>.asia</option>
    
    <option>.biz</option>
    <option>.com.tw</option>
    <option>.tw</option>
    <option>.org.tw</option>
    <option>.idv.tw</option>
    <option>.ca</option>
    <option>.cn</option>
    <option>.eu</option>
    <option>.name</option>
    
    <option>.cc</option>
    <option>.ac</option>
    <option>.io</option>
    <option>.sh</option>
    <option>.tv</option>
    <option>.bz</option>
    <option>.nu</option>
    <option>.ws</option>
    <option>.kids.us</option>
    
    <option>.com.cn</option>
    <option>.net.cn</option>
    <option>.org.cn</option>
    <option>.de</option>
    <option>.be</option>
    <option>.tc</option>
    <option>.vg</option>
    <option>.ms</option>
    <option>.gs</option>
    
    <option>.jp</option>
    <option>.net.nz</option>
    <option>.co.nz</option>
    <option>.org.nz</option>
    <option>.in</option>
    <option>.at</option>
    <option>.am</option>
    <option>.nl</option>
    <option>.fm</option>
    
    <option>.com.au</option>
    <option>.net.au</option>
    </select>
    <input type="submit" value="submit" class="search-go"> 
    </form>
    </div>
        
        
    
        
    <script type="text/javascript">
    var countries=new ddtabcontent("simple-tabs")
    countries.setpersist(true)
    countries.setselectedClassTarget("link") //"link" or "linkparent"
    countries.init()
    </script>
    Last edited by thehost5968; 12-12-09 at 12:38 AM.

  4. #4
    Join Date
    May 2009
    Location
    uk
    Posts
    953

    Default

    save this as tabcontent.js

    Code:
    //** Tab Content script v2.0-  Dynamic Drive DHTML code library (http://www.dynamicdrive.com)
    //** Updated Oct 7th, 07 to version 2.0. Contains numerous improvements:
    //   -Added Auto Mode: Script auto rotates the tabs based on an interval, until a tab is explicitly selected
    //   -Ability to expand/contract arbitrary DIVs on the page as the tabbed content is expanded/ contracted
    //   -Ability to dynamically select a tab either based on its position within its peers, or its ID attribute (give the target tab one 1st)
    //   -Ability to set where the CSS classname "selected" get assigned- either to the target tab's link ("A"), or its parent container
    //** Updated Feb 18th, 08 to version 2.1: Adds a "tabinstance.cycleit(dir)" method to cycle forward or backward between tabs dynamically
    //** Updated April 8th, 08 to version 2.2: Adds support for expanding a tab using a URL parameter (ie: http://mysite.com/tabcontent.htm?tabinterfaceid=0) 
    
    ////NO NEED TO EDIT BELOW////////////////////////
    
    function ddtabcontent(tabinterfaceid){
        this.tabinterfaceid=tabinterfaceid //ID of Tab Menu main container
        this.tabs=document.getElementById(tabinterfaceid).getElementsByTagName("a") //Get all tab links within container
        this.enabletabpersistence=true
        this.hottabspositions=[] //Array to store position of tabs that have a "rel" attr defined, relative to all tab links, within container
        this.currentTabIndex=0 //Index of currently selected hot tab (tab with sub content) within hottabspositions[] array
        this.subcontentids=[] //Array to store ids of the sub contents ("rel" attr values)
        this.revcontentids=[] //Array to store ids of arbitrary contents to expand/contact as well ("rev" attr values)
        this.selectedClassTarget="link" //keyword to indicate which target element to assign "selected" CSS class ("linkparent" or "link")
    }
    
    ddtabcontent.getCookie=function(Name){ 
        var re=new RegExp(Name+"=[^;]+", "i"); //construct RE to search for target name/value pair
        if (document.cookie.match(re)) //if cookie found
            return document.cookie.match(re)[0].split("=")[1] //return its value
        return ""
    }
    
    ddtabcontent.setCookie=function(name, value){
        document.cookie = name+"="+value+";path=/" //cookie value is domain wide (path=/)
    }
    
    ddtabcontent.prototype={
    
        expandit:function(tabid_or_position){ //PUBLIC function to select a tab either by its ID or position(int) within its peers
            this.cancelautorun() //stop auto cycling of tabs (if running)
            var tabref=""
            try{
                if (typeof tabid_or_position=="string" && document.getElementById(tabid_or_position).getAttribute("rel")) //if specified tab contains "rel" attr
                    tabref=document.getElementById(tabid_or_position)
                else if (parseInt(tabid_or_position)!=NaN && this.tabs[tabid_or_position].getAttribute("rel")) //if specified tab contains "rel" attr
                    tabref=this.tabs[tabid_or_position]
            }
            catch(err){alert("Invalid Tab ID or position entered!")}
            if (tabref!="") //if a valid tab is found based on function parameter
                this.expandtab(tabref) //expand this tab
        },
    
        cycleit:function(dir, autorun){ //PUBLIC function to move foward or backwards through each hot tab (tabinstance.cycleit('foward/back') )
            if (dir=="next"){
                var currentTabIndex=(this.currentTabIndex<this.hottabspositions.length-1)? this.currentTabIndex+1 : 0
            }
            else if (dir=="prev"){
                var currentTabIndex=(this.currentTabIndex>0)? this.currentTabIndex-1 : this.hottabspositions.length-1
            }
            if (typeof autorun=="undefined") //if cycleit() is being called by user, versus autorun() function
                this.cancelautorun() //stop auto cycling of tabs (if running)
            this.expandtab(this.tabs[this.hottabspositions[currentTabIndex]])
        },
    
        setpersist:function(bool){ //PUBLIC function to toggle persistence feature
                this.enabletabpersistence=bool
        },
    
        setselectedClassTarget:function(objstr){ //PUBLIC function to set which target element to assign "selected" CSS class ("linkparent" or "link")
            this.selectedClassTarget=objstr || "link"
        },
    
        getselectedClassTarget:function(tabref){ //Returns target element to assign "selected" CSS class to
            return (this.selectedClassTarget==("linkparent".toLowerCase()))? tabref.parentNode : tabref
        },
    
        urlparamselect:function(tabinterfaceid){
            var result=window.location.search.match(new RegExp(tabinterfaceid+"=(\\d+)", "i")) //check for "?tabinterfaceid=2" in URL
            return (result==null)? null : parseInt(RegExp.$1) //returns null or index, where index (int) is the selected tab's index
        },
    
        expandtab:function(tabref){
            var subcontentid=tabref.getAttribute("rel") //Get id of subcontent to expand
            //Get "rev" attr as a string of IDs in the format ",john,george,trey,etc," to easily search through
            var associatedrevids=(tabref.getAttribute("rev"))? ","+tabref.getAttribute("rev").replace(/\s+/, "")+"," : ""
            this.expandsubcontent(subcontentid)
            this.expandrevcontent(associatedrevids)
            for (var i=0; i<this.tabs.length; i++){ //Loop through all tabs, and assign only the selected tab the CSS class "selected"
                this.getselectedClassTarget(this.tabs[i]).className=(this.tabs[i].getAttribute("rel")==subcontentid)? "selected" : ""
            }
            if (this.enabletabpersistence) //if persistence enabled, save selected tab position(int) relative to its peers
                ddtabcontent.setCookie(this.tabinterfaceid, tabref.tabposition)
            this.setcurrenttabindex(tabref.tabposition) //remember position of selected tab within hottabspositions[] array
        },
    
        expandsubcontent:function(subcontentid){
            for (var i=0; i<this.subcontentids.length; i++){
                var subcontent=document.getElementById(this.subcontentids[i]) //cache current subcontent obj (in for loop)
                subcontent.style.display=(subcontent.id==subcontentid)? "block" : "none" //"show" or hide sub content based on matching id attr value
            }
        },
    
        expandrevcontent:function(associatedrevids){
            var allrevids=this.revcontentids
            for (var i=0; i<allrevids.length; i++){ //Loop through rev attributes for all tabs in this tab interface
                //if any values stored within associatedrevids matches one within allrevids, expand that DIV, otherwise, contract it
                document.getElementById(allrevids[i]).style.display=(associatedrevids.indexOf(","+allrevids[i]+",")!=-1)? "block" : "none"
            }
        },
    
        setcurrenttabindex:function(tabposition){ //store current position of tab (within hottabspositions[] array)
            for (var i=0; i<this.hottabspositions.length; i++){
                if (tabposition==this.hottabspositions[i]){
                    this.currentTabIndex=i
                    break
                }
            }
        },
    
        autorun:function(){ //function to auto cycle through and select tabs based on a set interval
            this.cycleit('next', true)
        },
    
        cancelautorun:function(){
            if (typeof this.autoruntimer!="undefined")
                clearInterval(this.autoruntimer)
        },
    
        init:function(automodeperiod){
            var persistedtab=ddtabcontent.getCookie(this.tabinterfaceid) //get position of persisted tab (applicable if persistence is enabled)
            var selectedtab=-1 //Currently selected tab index (-1 meaning none)
            var selectedtabfromurl=this.urlparamselect(this.tabinterfaceid) //returns null or index from: tabcontent.htm?tabinterfaceid=index
            this.automodeperiod=automodeperiod || 0
            for (var i=0; i<this.tabs.length; i++){
                this.tabs[i].tabposition=i //remember position of tab relative to its peers
                if (this.tabs[i].getAttribute("rel")){
                    var tabinstance=this
                    this.hottabspositions[this.hottabspositions.length]=i //store position of "hot" tab ("rel" attr defined) relative to its peers
                    this.subcontentids[this.subcontentids.length]=this.tabs[i].getAttribute("rel") //store id of sub content ("rel" attr value)
                    this.tabs[i].onclick=function(){
                        tabinstance.expandtab(this)
                        tabinstance.cancelautorun() //stop auto cycling of tabs (if running)
                        return false
                    }
                    if (this.tabs[i].getAttribute("rev")){ //if "rev" attr defined, store each value within "rev" as an array element
                        this.revcontentids=this.revcontentids.concat(this.tabs[i].getAttribute("rev").split(/\s*,\s*/))
                    }
                    if (selectedtabfromurl==i || this.enabletabpersistence && selectedtab==-1 && parseInt(persistedtab)==i || !this.enabletabpersistence && selectedtab==-1 && this.getselectedClassTarget(this.tabs[i]).className=="selected"){
                        selectedtab=i //Selected tab index, if found
                    }
                }
            } //END for loop
            if (selectedtab!=-1) //if a valid default selected tab index is found
                this.expandtab(this.tabs[selectedtab]) //expand selected tab (either from URL parameter, persistent feature, or class="selected" class)
            else //if no valid default selected index found
                this.expandtab(this.tabs[this.hottabspositions[0]]) //Just select first tab that contains a "rel" attr
            if (parseInt(this.automodeperiod)>500 && this.hottabspositions.length>1){
                this.autoruntimer=setInterval(function(){tabinstance.autorun()}, this.automodeperiod)
            }
        } //END int() function
    
    } //END Prototype assignment

  5. #5
    Join Date
    May 2009
    Location
    uk
    Posts
    953

    Default

    inline Styles
    Code:
    #simple-tabs{margin:0;padding:0;overflow:hidden;margin-bottom:10px;}
    #simple-tabs li a:hover{}
    #simple-tabs li a:visited{color:#fff;text-decoration:none;}
    #simple-tabs li a{font-size:11px;font-weight:bold;color:#fff;display:block;float:left;background:#426397;margin-right:10px;
    padding:0px 8px;line-height:25px;text-decoration:none;}
    #simple-tabs li{display:inline}
    #simple-tabs li a.selected{background:green}
    Thanks for this you are one of the best.

  6. #6
    Join Date
    Apr 2010
    Posts
    1

    Default

    I got the domain name here http://www.********.com/ and i got the free web hosting,domain name,domain registration,etc...

  7. #7
    Join Date
    Jun 2009
    Location
    Australia
    Posts
    41

    Default

    I have updated this to your new site, for those that are still interested in it.
    Kind Regards,
    Rachael
    Nerdster Web Hosting

  8. #8
    Join Date
    Jun 2009
    Location
    Australia
    Posts
    41

    Default

    The "searchtab.html"

    Replace the "ADD TOKEN VALUE" and the "ADD YOUR DOMAIN NAME"

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US">
    
    <head profile="http://gmpg.org/xfn/11">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    
    <title>Title</title>
    
    
    <link rel="stylesheet" type="text/css" href="tabcontent.css" />
    
    <script type="text/javascript" src="tabcontent.js">
    
    /***********************************************
    * Tab Content script v2.2- � Dynamic Drive DHTML code library (www.dynamicdrive.com)
    * This notice MUST stay intact for legal use
    * Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
    ***********************************************/
    
    </script>
    
    
    <style type="text/css">
    #simple-tabs{margin:0;padding:0;overflow:hidden;margin-bottom:10px;}
    #simple-tabs li a:hover{}
    #simple-tabs li a:visited{color:#fff;text-decoration:none;}
    #simple-tabs li a{font-size:11px;font-weight:bold;color:#fff;display:block;float:left;background:#426397;margin-right:10px;
    padding:0px 8px;line-height:25px;text-decoration:none;}
    #simple-tabs li{display:inline}
    #simple-tabs li a.selected{background:green}
    </style>
    
    
    
    	
    
    <ul id="simple-tabs">
    <li><a href="#" rel="simple-tabs-1" class="selected">Domain</a></li>
    <li><a href="#" rel="simple-tabs-2">Whois</a></li>
    <li><a href="#" rel="simple-tabs-3">Transfer</a></li>
    </ul>
    
    
    <div id="simple-tabs-1" class="tabcontent">
    <form target="_blank" action="http://ADD YOUR DOMAIN NAME/clients/domainchecker.php" method="post">
    <input type="hidden" name="token" value="ADD TOKEN VALUE" /> 
    <input type="hidden" name="direct" value="true"> 
    <input type="text" name="domain" size="40" class="search-field" value="Domain.." onfocus="if(this.value == 'Domain..') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Domain..';}"/> 
    <select name="ext" class="head-select">
    <option>.com</option>
    <option>.net</option>
    <option>.info</option>
    <option>.org</option>
    <option>.me</option>
    <option>.us</option>
    <option>.mobi</option>
    <option>.la</option>
    <option>.asia</option>
    <option>.biz</option>
    <option>.com.tw</option>
    <option>.tw</option>
    <option>.org.tw</option>
    <option>.idv.tw</option>
    <option>.ca</option>
    <option>.cn</option>
    <option>.eu</option>
    <option>.name</option>
    <option>.cc</option>
    <option>.ac</option>
    <option>.io</option>
    <option>.sh</option>
    <option>.tv</option>
    <option>.bz</option>
    <option>.nu</option>
    <option>.ws</option>
    <option>.kids.us</option>
    <option>.com.cn</option>
    <option>.net.cn</option>
    <option>.org.cn</option>
    <option>.de</option>
    <option>.be</option>
    <option>.tc</option>
    <option>.vg</option>
    <option>.ms</option>
    <option>.gs</option>
    <option>.jp</option>
    <option>.net.nz</option>
    <option>.co.nz</option>
    <option>.org.nz</option>
    <option>.in</option>
    <option>.at</option>
    <option>.am</option>
    <option>.nl</option>
    <option>.fm</option>
    <option>.com.au</option>
    <option>.net.au</option>
    </select>
    <input type="submit" value="submit" class="search-go"> 
    </form>
    </div>
    
    
    <div id="simple-tabs-2" class="tabcontent"  style="display:none">
    <form target="_blank" action="http://ADD YOUR DOMAIN NAME/clients/whois.php" method="post">
    <input type="text" id="domain1" onchange="document.getElementById('domain').value=document.getElementById('domain1').value + '' + document.getElementById('tld').value;" name="domain1" size="40" class="search-field" value="Whois.." onfocus="if(this.value == 'Whois..') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Whois..';}"/> 
    <select name="tld" id="tld" onchange="document.getElementById('domain').value=document.getElementById('domain1').value + ' ' + document.getElementById('tld').value;" class="head-select">
    <option>.com</option>
    <option>.net</option>
    <option>.info</option>
    <option>.org</option>
    <option>.me</option>
    <option>.us</option>
    <option>.mobi</option>
    <option>.la</option>
    <option>.asia</option>
    <option>.biz</option>
    <option>.com.tw</option>
    <option>.tw</option>
    <option>.org.tw</option>
    <option>.idv.tw</option>
    <option>.ca</option>
    <option>.cn</option>
    <option>.eu</option>
    <option>.name</option>
    <option>.cc</option>
    <option>.ac</option>
    <option>.io</option>
    <option>.sh</option>
    <option>.tv</option>
    <option>.bz</option>
    <option>.nu</option>
    <option>.ws</option>
    <option>.kids.us</option>
    <option>.com.cn</option>
    <option>.net.cn</option>
    <option>.org.cn</option>
    <option>.de</option>
    <option>.be</option>
    <option>.tc</option>
    <option>.vg</option>
    <option>.ms</option>
    <option>.gs</option>
    <option>.jp</option>
    <option>.net.nz</option>
    <option>.co.nz</option>
    <option>.org.nz</option>
    <option>.in</option>
    <option>.at</option>
    <option>.am</option>
    <option>.nl</option>
    <option>.fm</option>
    <option>.com.au</option>
    <option>.net.au</option>
    </select>
    <input type="hidden" name="domain" id="domain" value="" />
    <input type="submit" value="submit" class="search-go"> 
    </form>
    </div>
    
    
    <div id="simple-tabs-3" class="tabcontent"  style="display:none">
    <form target="_blank" action="http://ADD YOUR DOMAIN NAME/clients/cart.php?a=add&domain=transfer" method="post">
    <input type="text" name="sld" size="40" class="search-field" value="Transfer.." onfocus="if(this.value == 'Transfer..') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Transfer..';}"/> 
    <select name="tld" class="head-select">
    <option>.com</option>
    <option>.net</option>
    <option>.info</option>
    <option>.org</option>
    <option>.me</option>
    <option>.us</option>
    <option>.mobi</option>
    <option>.la</option>
    <option>.asia</option>
    <option>.biz</option>
    <option>.com.tw</option>
    <option>.tw</option>
    <option>.org.tw</option>
    <option>.idv.tw</option>
    <option>.ca</option>
    <option>.cn</option>
    <option>.eu</option>
    <option>.name</option>
    <option>.cc</option>
    <option>.ac</option>
    <option>.io</option>
    <option>.sh</option>
    <option>.tv</option>
    <option>.bz</option>
    <option>.nu</option>
    <option>.ws</option>
    <option>.kids.us</option>
    <option>.com.cn</option>
    <option>.net.cn</option>
    <option>.org.cn</option>
    <option>.de</option>
    <option>.be</option>
    <option>.tc</option>
    <option>.vg</option>
    <option>.ms</option>
    <option>.gs</option>
    <option>.jp</option>
    <option>.net.nz</option>
    <option>.co.nz</option>
    <option>.org.nz</option>
    <option>.in</option>
    <option>.at</option>
    <option>.am</option>
    <option>.nl</option>
    <option>.fm</option>
    <option>.com.au</option>
    <option>.net.au</option>
    </select>
    <input type="submit" value="submit" class="search-go"> 
    </form>
    </div>
    	
    	
    
    	
    <script type="text/javascript">
    var countries=new ddtabcontent("simple-tabs")
    countries.setpersist(true)
    countries.setselectedClassTarget("link") //"link" or "linkparent"
    countries.init()
    </script>	
    	
    	
    </body>
    </html>
    The "tabcontent.js"

    Code:
    //** Tab Content script v2.0-  Dynamic Drive DHTML code library (http://www.dynamicdrive.com)
    //** Updated Oct 7th, 07 to version 2.0. Contains numerous improvements:
    //   -Added Auto Mode: Script auto rotates the tabs based on an interval, until a tab is explicitly selected
    //   -Ability to expand/contract arbitrary DIVs on the page as the tabbed content is expanded/ contracted
    //   -Ability to dynamically select a tab either based on its position within its peers, or its ID attribute (give the target tab one 1st)
    //   -Ability to set where the CSS classname "selected" get assigned- either to the target tab's link ("A"), or its parent container
    //** Updated Feb 18th, 08 to version 2.1: Adds a "tabinstance.cycleit(dir)" method to cycle forward or backward between tabs dynamically
    //** Updated April 8th, 08 to version 2.2: Adds support for expanding a tab using a URL parameter (ie: http://mysite.com/tabcontent.htm?tabinterfaceid=0) 
    
    ////NO NEED TO EDIT BELOW////////////////////////
    
    function ddtabcontent(tabinterfaceid){
    	this.tabinterfaceid=tabinterfaceid //ID of Tab Menu main container
    	this.tabs=document.getElementById(tabinterfaceid).getElementsByTagName("a") //Get all tab links within container
    	this.enabletabpersistence=true
    	this.hottabspositions=[] //Array to store position of tabs that have a "rel" attr defined, relative to all tab links, within container
    	this.currentTabIndex=0 //Index of currently selected hot tab (tab with sub content) within hottabspositions[] array
    	this.subcontentids=[] //Array to store ids of the sub contents ("rel" attr values)
    	this.revcontentids=[] //Array to store ids of arbitrary contents to expand/contact as well ("rev" attr values)
    	this.selectedClassTarget="link" //keyword to indicate which target element to assign "selected" CSS class ("linkparent" or "link")
    }
    
    ddtabcontent.getCookie=function(Name){ 
    	var re=new RegExp(Name+"=[^;]+", "i"); //construct RE to search for target name/value pair
    	if (document.cookie.match(re)) //if cookie found
    		return document.cookie.match(re)[0].split("=")[1] //return its value
    	return ""
    }
    
    ddtabcontent.setCookie=function(name, value){
    	document.cookie = name+"="+value+";path=/" //cookie value is domain wide (path=/)
    }
    
    ddtabcontent.prototype={
    
    	expandit:function(tabid_or_position){ //PUBLIC function to select a tab either by its ID or position(int) within its peers
    		this.cancelautorun() //stop auto cycling of tabs (if running)
    		var tabref=""
    		try{
    			if (typeof tabid_or_position=="string" && document.getElementById(tabid_or_position).getAttribute("rel")) //if specified tab contains "rel" attr
    				tabref=document.getElementById(tabid_or_position)
    			else if (parseInt(tabid_or_position)!=NaN && this.tabs[tabid_or_position].getAttribute("rel")) //if specified tab contains "rel" attr
    				tabref=this.tabs[tabid_or_position]
    		}
    		catch(err){alert("Invalid Tab ID or position entered!")}
    		if (tabref!="") //if a valid tab is found based on function parameter
    			this.expandtab(tabref) //expand this tab
    	},
    
    	cycleit:function(dir, autorun){ //PUBLIC function to move foward or backwards through each hot tab (tabinstance.cycleit('foward/back') )
    		if (dir=="next"){
    			var currentTabIndex=(this.currentTabIndex<this.hottabspositions.length-1)? this.currentTabIndex+1 : 0
    		}
    		else if (dir=="prev"){
    			var currentTabIndex=(this.currentTabIndex>0)? this.currentTabIndex-1 : this.hottabspositions.length-1
    		}
    		if (typeof autorun=="undefined") //if cycleit() is being called by user, versus autorun() function
    			this.cancelautorun() //stop auto cycling of tabs (if running)
    		this.expandtab(this.tabs[this.hottabspositions[currentTabIndex]])
    	},
    
    	setpersist:function(bool){ //PUBLIC function to toggle persistence feature
    			this.enabletabpersistence=bool
    	},
    
    	setselectedClassTarget:function(objstr){ //PUBLIC function to set which target element to assign "selected" CSS class ("linkparent" or "link")
    		this.selectedClassTarget=objstr || "link"
    	},
    
    	getselectedClassTarget:function(tabref){ //Returns target element to assign "selected" CSS class to
    		return (this.selectedClassTarget==("linkparent".toLowerCase()))? tabref.parentNode : tabref
    	},
    
    	urlparamselect:function(tabinterfaceid){
    		var result=window.location.search.match(new RegExp(tabinterfaceid+"=(\\d+)", "i")) //check for "?tabinterfaceid=2" in URL
    		return (result==null)? null : parseInt(RegExp.$1) //returns null or index, where index (int) is the selected tab's index
    	},
    
    	expandtab:function(tabref){
    		var subcontentid=tabref.getAttribute("rel") //Get id of subcontent to expand
    		//Get "rev" attr as a string of IDs in the format ",john,george,trey,etc," to easily search through
    		var associatedrevids=(tabref.getAttribute("rev"))? ","+tabref.getAttribute("rev").replace(/\s+/, "")+"," : ""
    		this.expandsubcontent(subcontentid)
    		this.expandrevcontent(associatedrevids)
    		for (var i=0; i<this.tabs.length; i++){ //Loop through all tabs, and assign only the selected tab the CSS class "selected"
    			this.getselectedClassTarget(this.tabs[i]).className=(this.tabs[i].getAttribute("rel")==subcontentid)? "selected" : ""
    		}
    		if (this.enabletabpersistence) //if persistence enabled, save selected tab position(int) relative to its peers
    			ddtabcontent.setCookie(this.tabinterfaceid, tabref.tabposition)
    		this.setcurrenttabindex(tabref.tabposition) //remember position of selected tab within hottabspositions[] array
    	},
    
    	expandsubcontent:function(subcontentid){
    		for (var i=0; i<this.subcontentids.length; i++){
    			var subcontent=document.getElementById(this.subcontentids[i]) //cache current subcontent obj (in for loop)
    			subcontent.style.display=(subcontent.id==subcontentid)? "block" : "none" //"show" or hide sub content based on matching id attr value
    		}
    	},
    
    	expandrevcontent:function(associatedrevids){
    		var allrevids=this.revcontentids
    		for (var i=0; i<allrevids.length; i++){ //Loop through rev attributes for all tabs in this tab interface
    			//if any values stored within associatedrevids matches one within allrevids, expand that DIV, otherwise, contract it
    			document.getElementById(allrevids[i]).style.display=(associatedrevids.indexOf(","+allrevids[i]+",")!=-1)? "block" : "none"
    		}
    	},
    
    	setcurrenttabindex:function(tabposition){ //store current position of tab (within hottabspositions[] array)
    		for (var i=0; i<this.hottabspositions.length; i++){
    			if (tabposition==this.hottabspositions[i]){
    				this.currentTabIndex=i
    				break
    			}
    		}
    	},
    
    	autorun:function(){ //function to auto cycle through and select tabs based on a set interval
    		this.cycleit('next', true)
    	},
    
    	cancelautorun:function(){
    		if (typeof this.autoruntimer!="undefined")
    			clearInterval(this.autoruntimer)
    	},
    
    	init:function(automodeperiod){
    		var persistedtab=ddtabcontent.getCookie(this.tabinterfaceid) //get position of persisted tab (applicable if persistence is enabled)
    		var selectedtab=-1 //Currently selected tab index (-1 meaning none)
    		var selectedtabfromurl=this.urlparamselect(this.tabinterfaceid) //returns null or index from: tabcontent.htm?tabinterfaceid=index
    		this.automodeperiod=automodeperiod || 0
    		for (var i=0; i<this.tabs.length; i++){
    			this.tabs[i].tabposition=i //remember position of tab relative to its peers
    			if (this.tabs[i].getAttribute("rel")){
    				var tabinstance=this
    				this.hottabspositions[this.hottabspositions.length]=i //store position of "hot" tab ("rel" attr defined) relative to its peers
    				this.subcontentids[this.subcontentids.length]=this.tabs[i].getAttribute("rel") //store id of sub content ("rel" attr value)
    				this.tabs[i].onclick=function(){
    					tabinstance.expandtab(this)
    					tabinstance.cancelautorun() //stop auto cycling of tabs (if running)
    					return false
    				}
    				if (this.tabs[i].getAttribute("rev")){ //if "rev" attr defined, store each value within "rev" as an array element
    					this.revcontentids=this.revcontentids.concat(this.tabs[i].getAttribute("rev").split(/\s*,\s*/))
    				}
    				if (selectedtabfromurl==i || this.enabletabpersistence && selectedtab==-1 && parseInt(persistedtab)==i || !this.enabletabpersistence && selectedtab==-1 && this.getselectedClassTarget(this.tabs[i]).className=="selected"){
    					selectedtab=i //Selected tab index, if found
    				}
    			}
    		} //END for loop
    		if (selectedtab!=-1) //if a valid default selected tab index is found
    			this.expandtab(this.tabs[selectedtab]) //expand selected tab (either from URL parameter, persistent feature, or class="selected" class)
    		else //if no valid default selected index found
    			this.expandtab(this.tabs[this.hottabspositions[0]]) //Just select first tab that contains a "rel" attr
    		if (parseInt(this.automodeperiod)>500 && this.hottabspositions.length>1){
    			this.autoruntimer=setInterval(function(){tabinstance.autorun()}, this.automodeperiod)
    		}
    	} //END int() function
    
    } //END Prototype assignment
    Kind Regards,
    Rachael
    Nerdster Web Hosting

  9. #9
    Join Date
    Jun 2009
    Location
    Australia
    Posts
    41

    Default

    Quote Originally Posted by hellokit9713 View Post
    I have updated this to your new site, for those that are still interested in it
    Sorry, I meant our new domain name

    Thanks for pointing that out Hellokit9713
    Kind Regards,
    Rachael
    Nerdster Web Hosting

Similar Threads

  1. Replies: 0
    Last Post: 05-05-13, 07:43 AM
  2. Dropdown menu in domain search empty
    By urbanehop in forum Technical Issues and Questions
    Replies: 5
    Last Post: 09-15-11, 10:32 PM
  3. Adding a menu tab with dropdown in backend/admin side
    By chrisnpg in forum Customisation and Integration Questions
    Replies: 9
    Last Post: 08-02-09, 04:07 AM
iron-diatonic