SitePoint Sponsor

User Tag List

Page 1 of 2 12 LastLast
Results 1 to 25 of 43

Thread: Tabs

  1. #1
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Tabs

    Hello,
    I ahve found a nice tab script whcih I would like to use at the following link:

    http://livepipe.net/control/tabs

    I can;t seem to figure out how to set it up and what files I need. Can anyone help?

    Thanks

    Regards,
    Neil

  2. #2
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I ahve set my HTML code up correctly but do NOT understand what js files I need, where I get them from and what code to add into the head of my page? and what css file do I link to to style the tab links?

  3. #3
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Please help, someone?

  4. #4
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I ahve tried getting the code provided on the site and saved it as tabs.js and linked to it from the head of my page and the same with the prototype.js page I downloaded from the official prototype website but it doesn;t seem to work. Any ideas guys?

  5. #5
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Is there anyone that can explain how to set this script up?

  6. #6
    dooby dooby doo silver trophybronze trophy
    spikeZ's Avatar
    Join Date
    Aug 2004
    Location
    Manchester UK
    Posts
    13,807
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    Hi Neil,

    Look at the source of the page and you need the following files:

    http://livepipe.net/javascripts/prototype.js
    http://livepipe.net/javascripts/livepipe.js

    and
    http://github.com/saucytiger/livepip...er/src/tabs.js

    then use the example that is shown on the page.

    If you are not fussed about using prototype you can achieve the same effect in jQuery or Mootools.
    Mike Swiffin - Community Team Advisor
    Only a woman can read between the lines of a one word answer.....

  7. #7
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello,
    Right, I ahve downloaded all those files and linked to them using the following 3 lines:

    <!--include javascripts-->
    <script src="<?php echo ($linkprefix."javascripts/prototype.js"); ?>" type="text/javascript"></script>
    <script src="<?php echo ($linkprefix."javascripts/tabs.js"); ?>" type="text/javascript"></script>
    <script src="<?php echo ($linkprefix."javascripts/livepipe.js"); ?>" type="text/javascript"></script>
    <!------------------------>

    But it still does not want to seem to work.

    Any more ideas?

  8. #8
    dooby dooby doo silver trophybronze trophy
    spikeZ's Avatar
    Join Date
    Aug 2004
    Location
    Manchester UK
    Posts
    13,807
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    give a minute to set it up - brb
    Mike Swiffin - Community Team Advisor
    Only a woman can read between the lines of a one word answer.....

  9. #9
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    okiedoke, Thanks

  10. #10
    dooby dooby doo silver trophybronze trophy
    spikeZ's Avatar
    Join Date
    Aug 2004
    Location
    Manchester UK
    Posts
    13,807
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    righty then.

    I have stripped this down as much as possible to the bare bones of the HTML and css.

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    
    <head>
    	<title>Untitled 4</title>
    	<script src="javascript/prototype.js" type="text/javascript"></script>
    	<script src="javascript/livepipe.js" type="text/javascript"></script>
    	<script src="javascript/tabs.js" type="text/javascript"></script>
    </head>
    <style>
    /* Subsection Tabs
    --------------------*/
    #main ul.subsection_tabs {
    	list-style:none;
    	margin:0 0 5px 0;
    	padding:0;
    	clear:both;
    	border-bottom:1px solid #ccc;
    	height:20px;
    	clear:both;
    }
    
    #main ul.subsection_tabs li.tab {
    	float:left;
    	margin-right:7px;
    	text-align:center;
    }
    
    #main ul.subsection_tabs li.tab a {
    	display:block;
    	height:20px;
    	padding:0 6px 0 6px;
    	background-color:#fff;
    	color:#666;
    	width:80px;
    }
    
    #main ul.subsection_tabs li.tab a:hover {
    	color:#666;
    }
    
    #main ul.subsection_tabs li.tab a.active {
    	background-color:#ddd;
    }
    
    #main ul.subsection_tabs li.source_code {
    	float:right;
    }
    
    </style>
    
    
    	
    <script>
    	document.observe('dom:loaded',function(){			
    		//example 1
    	new Control.Tabs('tabs_example_one');
    	});
    	</script>
    <body class="control">
    
    <div id="main">
    					
    <script>
    	document.observe('dom:loaded',function(){
    		new Control.Tabs('main_tabs',{
    			linkSelector: 'li.tab a'
    		});
    	});
    </script>
    	<!-- example 1 -->
    	<ul id="tabs_example_one" class="subsection_tabs">
    		<li class="tab"><a href="#one">One</a></li>
    
    		<li class="tab"><a href="#two">Two</a></li>
    	</ul>
    	<div id="one"><p>This is the simplest example of a set of tabs.</p></div>
    	<div id="two"><p>Note that the styling for the tabs is done with CSS, not the Control.Tabs script.</p></div>		
    		</div>
    	</body>
    </html>
    Obviously check your paths and the js files.

    Works for me - although it seems like a huge amount of code for such a small thing.
    Mike Swiffin - Community Team Advisor
    Only a woman can read between the lines of a one word answer.....

  11. #11
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question

    Hello,
    Just tried your code and that works fine but when trying it within my site it just does not work. Can you spot any silly mistakes within this page:

    HTML 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">
    
    <head>
    
    <!--Favicon Link-->
    <link rel="shortcut icon" href=".ico" >
    <!--------------------->
    
    <!--Meta Tags-->
    <!--Meta Tags-->
    <meta name="classification" content="Entertainment" />
    <meta name="description" content="Alton Towers Mania, a great resource about the UK's number 1 theme park, Alton Towers." />
    <meta name="MSSmartTagsPreventParsing" content="TRUE" />
    <meta name="keywords" content="alton towers, towers street, merrie england, katanga canyon, gloomy wood, forbidden valley, old macdonalds farmyard, storybook land, adventure land, x-sector, the towers, fountain square, ug land, the gardens, splash landings hotel, alton towers hotel, waterpark, cariba creek, teacups, the flume, splash kart challenge, congo river rapids, runaway mine train, duel, haunted house, thunderlooper, nemesis, blade, ripsaw, air, ribena berry bish bash, doodle doo derby, riverbank eye spy express, squirrel nutty ride, spinball whizzer, beastie, oblivion, enterprise, submission, black hole, hex, legend of the towers, rita, queen of speed, corkscrew, the, ug swinger, bone shaker, 1001 nights, charlie and the chocolate factory, toyland tours, peugeot, driving school, family days out, staffordshire, alton, jcb, farley, ride tracker, news, electric towers, chocolate towers, 207, Bolliger &amp; Mabilard, Intamin, Huss, Days out, extraordinary, flying machine, carribean, halloween, summer, lake, thrilling, adrenaline, hogs head, grill, ride tracker, forums, roller coasters, themeparks, amusement parks, days out, alton, towers, castle, ghost, hunt" />
    <meta name="robots" content="ALL" />
    <meta name="rating" content="Safe For Kids" />
    <meta name="author" content="Neil Tonge" />
    <meta http-equiv="reply-to" content="rctneil@aol.com" />
    
    <!--<meta http-equiv="Page-Exit" content="progid:DXImageTransform.Microsoft.Fade(duration=2,overlap=0);" />--><!--------------------->
    
    <!--Stylesheet Links-->
    <link href="stylesheets/reset_styles.css" rel="stylesheet" type="text/css" />
    <link href="stylesheets/layout.css" rel="stylesheet" type="text/css" />
    <link href="stylesheets/navigation.css" rel="stylesheet" type="text/css" />
    <link href="stylesheets/misc.css" rel="stylesheet" type="text/css" />
    
    
    <!--------------------->
    
    <!--include javascripts-->
    <script src="javascripts/prototype.js" type="text/javascript"></script>
    <script src="javascripts/tabs.js" type="text/javascript"></script>
    <script src="javascripts/livepipe.js" type="text/javascript"></script>
    <!------------------------>
    
    <style>
    ul.subsection_tabs {
    	list-style:none;
    	margin:0 0 0px 0;
    	padding:0;
    	clear:both;
    	border-bottom:0px solid #ccc;
    	height:15px;
    	clear:both;
    }
    
    ul.subsection_tabs li.tab {
    	float:left;
    	margin-right:3px;
    	text-align:center;
    
    }
    
    ul.subsection_tabs li.tab a {
    	display:block;
    	height:20px;
    	padding:0 6px 0 6px;
    	background-color:#012349;
    	color:#00ccff;
    }
    
    ul.subsection_tabs li.tab a:hover {
    	color:#666;
    }
    
    ul.subsection_tabs li.tab a.active {
    	background-color:#ddd;
    	color:#00ccff;
    }
    </style>
    
    <!--Set the page title-->
    <title>Alton Towers Mania - For everything Alton Towers! :: Park Guide</title><!--------------------->
    
    </head>
    
    <body>
    
    <div id="bigwrapper">
    
    			<!--If live.txt exits then include live db connection code otherwise include local db connection code-->
    						<!--------------------->
    
    <div id="container">
    
    
    <div id="header">
    	<a href="index.php">
    		<img src="img/site_graphics/header/header.jpg" alt="Alton Towers Mania" />
    	</a>
    </div>
    
    
    <div id="navigation">
    	<img src="img/headings/navbar_headings/navigation.jpg" alt="Navigation" class="heading" />
    
    <div id="navlinks">
    <ul>
    	<li>-&nbsp;<a href="index.php">Home</a></li>
    	<li>-&nbsp;<a href="guides.php">Guides</a></li>
    	<li>-&nbsp;<a href="featuresinfo.php">Features & Info</a></li>
    	<li>-&nbsp;<a href="multimedia.php">Multimedia</a></li>
    	<li>-&nbsp;<a href="map.php">Resort Map</a></li>
    	<li>-&nbsp;<a href="photokorn">Image Gallery</a></li>
    	<li>-&nbsp;<a href="#.php">Community Forum</a></li>
    	<li>-&nbsp;<a href="contactus.php">Contact Us</a></li>
    </ul>
    </div>
    <img src="img/small_graphics/menu_divider.gif" class="menudivider" />
    
    <img src="img/headings/navbar_headings/status.jpg" alt="Resort Status" class="heading" />
    <div id="status">
    	<p>Theme Park:<img src="img/small_graphics/park_status/open.gif" alt="The theme park is currently OPEN." /></p>
    	<p>Hotels:<img src="img/small_graphics/park_status/open.gif" alt="The hotels are currently OPEN." /></p>
    	<p>Spa:<img src="img/small_graphics/park_status/open.gif" alt="The spa is currently OPEN." /></p>
    	<p>Waterpark:<img src="img/small_graphics/park_status/open.gif" alt="The waterpark is currently OPEN." /></p>
    	<p>Golf:<img src="img/small_graphics/park_status/open.gif" alt="The golf is currently OPEN." /></p>
    	<p>Conf Centre:<img src="img/small_graphics/park_status/open.gif" alt="The conference centre is currently OPEN." /></p>
    </div>
    
    <img src="img/small_graphics/menu_divider.gif" class="menudivider" />
    
    <img src="img/headings/navbar_headings/daytip.jpg" alt="Day Tip" class="heading" />
    <div id="tip">
    	<p>
    		Sun cream is essential on hot days. Use it generously before you go to save days of pain afterwards.	</p>
    	<br />
    </div>
    
    <img src="img/small_graphics/menu_divider.gif" class="menudivider" />
    
    <img src="img/headings/navbar_headings/randomride.jpg" alt="Random Ride" class="heading" />
    <div id="randomride">
    	<p>
    		<a href="ride_detail.php?ride_id=37">Frog Hopper</a>	</p>
    </div>
    
    <img src="img/small_graphics/menu_divider.gif" class="menudivider" />
    
    <!--Creates a bit of space at bottom of nav-->
    <br />
    <br />
    <br />
    <br />
    
    
    </div>
    
    <div id="content">
    
    	<div id="breadcrumb">
    			</div>
    
    	<div id="date">
    			</div>	<!--####################### - START PAGE CONTENT - ################################-->
    
    	<!--Background Sound Module-->
    		<!--End Background Sound Module-->
    	
    	<!--Title Image or Text Module-->
    	
    				<img src="img/guide_pics/ride/headers/nemlogo.jpg" class="ride_header" alt="Nemesis" /><br />
    
    		<!--/Title Image or Text Module-->
    	<br />
    <script>
    	document.observe('dom:loaded',function(){			
    	new Control.Tabs('tabs');
    	});
    </script>
    
    <script>
    	document.observe('dom:loaded',function(){
    	new Control.Tabs('main_tabs',{
    	linkSelector: 'li.tab a'
    	});
    	});
    </script>
    	<ul id="tabs" class="subsection_tabs">
    		<li class="tab">
    			<a href="#tab1">Intro</a>
    		</li>
    		<li class="tab">
    			<a href="#tab2">Statistics</a>
    		</li>
    		<li class="tab">
    			<a href="#tab3">Location</a>
    		</li>
    		<li class="tab">
    			<a href="#tab4">Gallery</a>
    		</li>
    		
    		<!--If an includetab is available then show it-->
    						<li class="tab">
    					<a href="#tab5">Legend</a>
    				</li>
    				
    		<li class="tab">
    			<a href="#tab6">Multimedia</a>
    		</li>
    		<li class="tab">
    			<a href="#tab7">Links</a>
    		</li>
    		<li class="tab">
    			<a href="#tab8">Comments</a>
    		</li>
    	</ul>
    
    	
    	<div class="tab_blend1"></div>
    
    <div>
    	<!--------------------------------------------------------------------------------------------------------------------------------->
        <div id="tab1"><!--Start of tab 1-->
    		<div class="box1">
    			<img src="img/headings/introduction.jpg" class="heading" alt="Introduction" />
    		</div>
    		<div class="box2">
    		<div class="averagebox">
    			<p>
    				Average Visitor Rating:
    			</p>
    			<img src="img/votestars/5star.gif" />&nbsp;-&nbsp;1 Rating/s		</div>
    		</div>
    		<div class="clearer"></div>
    		
    		<hr />
    		
    		<!--Review and pic goes in here-->
    		<p><img src="img/guide_pics/ride/nemesis.jpg" alt="Ride Photo" class="ride_photo" />Pulling 3.5G's and hitting speeds of up to 81kph Nemesis still pulls in the crowds at Alton Towers and has done so for over 11 years .The legend of Nemesis started construction in 1991 and took three years to build for its 1994 opening!<br /><br />
    The reason Nemesis took so long to build is because unlike most roller coasters from around the world, Nemesis is set in a large pit and has a marvellous theme and story line! Themed as a alien who came to earth to find peace over 2 million years ago but then was disturbed by routine maintenance work at Alton towers, The creature woke up , angry at being discovered, caused havoc, ripping up trees and buildings sending them hurtling skyward ! Nemesis was pinned down by steel (coaster track) and has remained trapped to this day, we merely irritants now ride it fuelling its annoyance!<br /><br /><br />
    The queue line was specially designed to show each part of the coaster track to build fear and excitement for its riders, you can only see the beauty of Nemesis once your in the queue line, from a spectators point of view its impossible to see the true nature of this world famous roller coaster!<br /><br />
    As you enter to station building there are two queue lines, one for normal riding and one for front row (queue for the front of you want the ultimate Nemesis experience - Queue times can be increased by up to 30 mins) as you pull your over head harness down the work operators come and check your safely strapped in, when given the all clear your train starts to move out of the station slowly and turns right and up the lift hill! As you start to climb your heart beat increases as you start to realize what your about to embark upon ! At the top of the lift hill there is a small drop and a banked turn in to a steeper drop, with this, the train builds up enough speed for your first inversion, a barrel roll over awaiting riders below, after that you quickly hit a high speed downwards helix just missing a rusty old fence were spectators watch in amazement! As you shoot up a small hill twisting over a zero G roll ! Your body experiences 4 seconds of weightlessness! Rolling fast over the large pit up you zoom up and over a blood water fall (water dye) and around a banked turn taking you down a drop into the loop, just missing the floor below! With the speed you have picked up you blast threw a tunnel and over a banked curve and up a straight getting ready for the last inversion a corkscrew just missing a rusty bus! After that you shoot up and round hitting the brake run!<br /><br />
    Nemesis also gives you a chance to purchase an on-ride photo of you from the booth just after the exit ramp. For the start of the 2005 season, Nemesis has also had a single rider queue fitted to get you on much quicker and faster than before by filling up empty seats.<br /><br />
    Nemesis is Alton towers most famous attraction, And still holds the title for the worlds most intense ride experience!</p>			
    		<br />
    		<br />
    		<div class="tab_blend2"></div>
    	</div>
    	<!--------------------------------------------------------------------------------------------------------------------------------->
    	<div id="tab2"><!--Start of tab 2-->
    		<img src="img/headings/statistics.jpg" class="heading" alt="Statistics" />
    
    		<p>
    			The table displays a wide variety of statistics about Nemesis.
    		</p>
    		
    		<hr />
    
    		<br />
    		<div>
    		
    <table>
    
    <!--Ride Name-->
    					<tr>
    					<th width="50%">
    						<h2>
    							Ride Name - <a href="#" onMouseover="showhint('The name of the ride.', this, event, '150px')">[?]</a>
    						</h2>
    					</th>
    					<td>
    						Nemesis					</td>
    				</tr>
    	<!--End Ride Name-->
    
    <!--Location-->
    	
    	<tr>
    		<th>
    			<h2>
    				Location
    			</h2>
    		</th>
    		<td>
    			<table>
    				<tr><td>Forbidden Valley</td></tr>			</table>
    		</td>
    	</tr>
    <!--End Location-->
    
    <!--Ride Duration-->
    					<tr>
    					<th>
    						<h2>
    							Ride Duration - <a href="#" onMouseover="showhint('Shows how long the ride lasts for.', this, event, '150px')">[?]</a>
    						</h2>
    					</th>
    					<td>
    						Approx 1 Minute, 30 Seconds					</td>
    				</tr>
    	<!--End Ride Duration-->
    
    <!--Cost-->
    					<tr>
    					<th>
    						<h2>
    							Cost - <a href="#" onMouseover="showhint('Shows how much the ride cost to build.', this, event, '150px')">[?]</a>
    						</h2>
    					</th>
    					<td>
    						10 Million					</td>
    				</tr>
    	<!--End Cost-->
    
    <!--Maximum G-Force-->
    					<tr>
    					<th>
    						<h2>
    							Maximum G-Force - <a href="#" onMouseover="showhint('Shows what the highest G Force is whcih the ride pulls (G Force is the force which is exerted on the riders).', this, event, '150px')">[?]</a>
    						</h2>
    					</th>
    					<td>
    						4G					</td>
    				</tr>
    	<!--End Maximum G-Force-->
    
    <!--Year Installed-->
    					<tr>
    					<th>
    						<h2>
    							Year Installed - <a href="#" onMouseover="showhint('Shows what year the ride was installed.', this, event, '150px')">[?]</a>
    						</h2>
    					</th>
    					<td>
    						1994					</td>
    				</tr>
    	<!--End Year Installed-->
    
    <!--Number of Stations-->
    					<tr>
    					<th>
    						<h2>
    							Number of Stations - <a href="#" onMouseover="showhint('Shows how many stations the ride has (Does not count onload and offload as two stations).', this, event, '150px')">[?]</a>
    						</h2>
    					</th>
    					<td>
    						1					</td>
    				</tr>
    	<!--End Number of Stations-->
    
    <!--Track Length-->
    					<tr>
    					<th>
    						<h2>
    							Track Length - <a href="#" onMouseover="showhint('Shows how long the length of the track is.', this, event, '150px')">[?]</a>
    						</h2>
    					</th>
    					<td>
    						716 Metres					</td>
    				</tr>
    	<!--End Track Length-->
    
    <!--Maximum Height-->
    	<!--End Maximum Height-->
    
    <!--Maximum Speed-->
    					<tr>
    					<th>
    						<h2>
    							Maximum Speed - <a href="#" onMouseover="showhint('Shows how fast the ride goes at it\'s fastest point.', this, event, '150px')">[?]</a>
    						</h2>
    					</th>
    					<td>
    						50 Mph					</td>
    				</tr>
    	<!--End Maximum Speed-->
    
    <!--Height of Drop-->
    					<tr>
    					<th>
    						<h2>
    							Height of Drop - <a href="#" onMouseover="showhint('Shows the height of the highest drop.', this, event, '150px')">[?]</a>
    						</h2>
    					</th>
    					<td>
    						13 Metres					</td>
    				</tr>
    	<!--End Height of Drop-->
    
    <!--Capacity-->
    					<tr>
    					<th>
    						<h2>
    							Capacity - <a href="#" onMouseover="showhint('Shows the maximum of riders the ride can cope with.', this, event, '150px')">[?]</a>
    						</h2>
    					</th>
    					<td>
    						64					</td>
    			    </tr>
    	<!--End Capacity-->
    
    <!--Throughput-->
    					<tr>
    					<th>
    						<h2>
    							Throughput - <a href="#" onMouseover="showhint('Shows the number of people who can ride each hour.', this, event, '150px')">[?]</a>
    						</h2>
    					</th>
    					<td>
    						1400 per hour					</td>
    				</tr>
    	<!--End Throughput-->
    
    <!--Seating Arrangements-->
    					<tr>
    					<th>
    						<h2>
    							Seating Arrangements - <a href="#" onMouseover="showhint('Shows how the seats are arranged.', this, event, '150px')">[?]</a>
    						</h2>
    					</th>
    					<td>
    						2 Trains, 8 Rows, 4 Seats					</td>
    				</tr>
    	<!--End Seating Arrangements-->
    
    <!--Restraints-->
    					<tr>
    					<th>
    						<h2>
    							Restraints
    						</h2>
    					</th>
    				<td>
    					Over Shoulder Restraints & Belts				</td>
    			</tr>
    	<!--End Restraints-->
    
    <!--Height Restriction-->
    					<tr>
    					<th>
    						<h2>
    							Height Restriction
    						</h2>
    					</th>
    					<td>
    						Must be 1.4 metres					</td>
    				</tr>
    	<!--End Height Restriction-->
    
    <!--On-Ride Photography Available?-->
    					<tr>
    					<th>
    						<h2>
    							On-Ride Photography Available?
    						</h2>
    					</th>
    					<td>
    						Yes - Booth up steps at exit of ride					</td>
    				</tr>
    	<!--End On-Ride Photography Available?-->
    
    <!--Slogan-->
    	
    	<tr>
    		<th>
    			<h2>
    				Slogan
    			</h2>
    		</th>
    		<td>
    			<table>
    				<tr><td>Sit Back It's Fright Time!</td></tr>			</table>
    		</td>
    	</tr>
    <!--End Slogan-->
    
    <!--Manufacturer-->
    	
    				<tr>
    					<th>
    						<h2>
    							Manufacturer
    						</h2>
    					</th>
    					<td>
    												<table>
    							<tr><td>Bolliger & Mabillard</td></tr>						</table>
    					</td>
    				</tr>
    	<!--End Manufacturer-->
    
    <!--Year Relocated-->
    	<!--End Year Relocated-->
    
    </table>
    
    		</div>
    
    		
    		<br />
    		<br />
    		<div class="tab_blend2"></div>
    	</div>
    	<!--------------------------------------------------------------------------------------------------------------------------------->
    	<div id="tab3"><!--Start of tab 3-->
    		<img src="img/headings/location.jpg" class="heading" alt="Location" />
    
    		
    				<p>
    				The map below is centered on the location of Nemesis so you can see the context of it's location to the park and other attractions. The map image itself may be out of date but the location of the ride will be correct.
    			</p>
    			
    		<hr />
    		<?php// echo $getridedata['ride_latlong']; ?>
    		<!--Map will go here-->
    		<!--<iframe src="includes/googlemap.inc.php" name="googlemap" width="500" height="300" frameborder="0" id="googlemap"></iframe>-->
    		<?php// include('includes/googlemap.inc.php'); ?>
    		
    		<br />
    		<br />
    		<div class="tab_blend2"></div>
    	</div>
    	<!--------------------------------------------------------------------------------------------------------------------------------->
    	<div id="tab4"><!--Start of tab 4-->
    		<img src="img/headings/gallery.jpg" class="heading" alt="Gallery" />
    		<p>
    			The gallery for Nemesis is shown below. Click any thumbnail to enlarge it.
    		</p>
    		
    		<hr />
    		
    		<br />
    		<br />
    		
    			
    <!--If live.txt exits then use the first block of code for live otherwise use the bottom
    <!----------------------->
    
    <table border="0" cellpadding="10" cellspacing="1" width="100%"><tr>
    <td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=3"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772056-9.jpg" width="160" height="120" border="0" title="Views: 13
    Downloads: 3
    Date: 09.04.08
    1600x1200 (600.9 KB)" alt="Views: 13
    Downloads: 3
    Date: 09.04.08
    1600x1200 (600.9 KB)" /></a><br />Air on it's ba...</td><td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=10"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772068-9.jpg" width="160" height="120" border="0" title="Views: 11
    Downloads: 2
    Date: 09.04.08
    2272x1704 (910.9 KB)" alt="Views: 11
    Downloads: 2
    Date: 09.04.08
    2272x1704 (910.9 KB)" /></a><br />The Air shop</td><td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=6"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772061-9.jpg" width="160" height="120" border="0" title="Views: 10
    Downloads: 1
    Date: 09.04.08
    1280x960 (444.6 KB)" alt="Views: 10
    Downloads: 1
    Date: 09.04.08
    1280x960 (444.6 KB)" /></a><br />The rock struc...</td>
    </tr>
    <tr>
    <td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=5"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772060-9.jpg" width="160" height="120" border="0" title="Views: 7
    Downloads: 2
    Date: 09.04.08
    1280x960 (434.1 KB)" alt="Views: 7
    Downloads: 2
    Date: 09.04.08
    1280x960 (434.1 KB)" /></a><br />One of the hel...</td><td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=4"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772058-9.jpg" width="160" height="120" border="0" title="Views: 7
    Downloads: 1
    Date: 09.04.08
    1280x960 (445.1 KB)" alt="Views: 7
    Downloads: 1
    Date: 09.04.08
    1280x960 (445.1 KB)" /></a><br />Looking toward...</td><td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=7"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772063-9.jpg" width="160" height="120" border="0" title="Views: 12
    Downloads: 2
    Date: 09.04.08
    1280x960 (471.6 KB)" alt="Views: 12
    Downloads: 2
    Date: 09.04.08
    1280x960 (471.6 KB)" /></a><br />More track!</td>
    </tr>
    <tr>
    <td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=9"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772067-9.jpg" width="160" height="120" border="0" title="Views: 7
    Downloads: 2
    Date: 09.04.08
    1280x960 (456.2 KB)" alt="Views: 7
    Downloads: 2
    Date: 09.04.08
    1280x960 (456.2 KB)" /></a><br />Inside the sta...</td><td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=8"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772065-9.jpg" width="160" height="120" border="0" title="Views: 8
    Downloads: 2
    Date: 09.04.08
    1280x960 (459.7 KB)" alt="Views: 8
    Downloads: 2
    Date: 09.04.08
    1280x960 (459.7 KB)" /></a><br />Air on it's co...</td><td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=11"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772071-9.jpg" width="160" height="120" border="0" title="Views: 24
    Downloads: 6
    Date: 09.04.08
    2272x1704 (1.0 MB)" alt="Views: 24
    Downloads: 6
    Date: 09.04.08
    2272x1704 (1.0 MB)" /></a><br />Forbidden Vall...</td>
    </tr>
    <tr>
    <td bgcolor="#f5f5f5" align="center" class="thumb">
    <a href="http://localhost/template atm/photokorn/pic.php?id=2"><img src="http://localhost/template atm/photokorn/photos/9/thb_1207772054-9.jpg" width="160" height="120" border="0" title="Views: 5
    Downloads: 0
    Date: 09.04.08
    1600x1200 (608.7 KB)" alt="Views: 5
    Downloads: 0
    Date: 09.04.08
    1600x1200 (608.7 KB)" /></a><br />Another rock s...</td></table>
    			<!--If live.txt exits then include live db connection code otherwise include local db connection code-->
    						<!--------------------->
    
    
    		<br />
    		<br />
    		<div class="tab_blend2"></div>
    	</div>
    	<!--------------------------------------------------------------------------------------------------------------------------------->
    				<div id="tab5"><!--Start of tab 5-->
    				<!--Nemesis Include-->
    <img src="img/headings/nemesislegend.jpg" class="heading" alt="Nemesis Legend" />
    <p>
    	Read the legend behind Nemesis here!
    </p>
    	
    <hr />
    
    <p>"Nobody knows where it came from, Nobody knows what it wants. There are theories and then, there is the legend. Nemesis comes from another dimension. A dimension beyond our imagination. It's tragedy is that it has no home. It has suffered rejections throughout the solar system. It could not communicate or make itself understood. No civillisation anywhere, in any galaxy would come to terms with it's awesome power, it's brooding unpredictability, it's mind! Bewildered, affraid, mentally tortured by not knowing it's origins, people turned against it, they fought it. They used everything against it - But Nemesis has no fear. They were mere irrantants to Nemesis, to be swatted away like flies. It left to seek sanctuary, but it searched in vain. Unwanted, it was jettisoned towards earth, 2 million years ago. It has remained here ever since, drawing it's energy from the earths core. For centuries, people were drawn to the mysterious place where it was thought to be laid buried."</p>
    
    
    <br />
    <br />
    <!--End Nemesis Include-->			</div>
    		<!--------------------------------------------------------------------------------------------------------------------------------->
    	<div id="tab6"><!--Start of tab 6-->
    		<img src="img/headings/multimedia.jpg" class="heading" alt="Multimedia" />
    		<p>
    			Any multimedia available for Nemesis is shown below. The links will take you to a page with more detailed information about that piece of multimedia.
    		</p>
    		
    		<hr />
    		<br />
    		
    		<ul class="styledlist"><li><a href="detail_multimedia.php?multimediaid=96">Flight Simulator 2002: Alton Towers</a></li><li><a href="detail_multimedia.php?multimediaid=53">Nemesis - Offride Video</a></li><li><a href="detail_multimedia.php?multimediaid=111">Nemesis - Your Day Film</a></li><li><a href="detail_multimedia.php?multimediaid=36">Nemesis Soundtrack</a></li><li><a href="detail_multimedia.php?multimediaid=139">Nemesis Story Soundtrack</a></li><li><a href="detail_multimedia.php?multimediaid=88">Nemesis Userbar</a></li><li><a href="detail_multimedia.php?multimediaid=82">RCT2: Alton Towers Custom Scenery Tab Version 2</a></li><li><a href="detail_multimedia.php?multimediaid=83">RCT2: Alton Towers Prime</a></li><li><a href="detail_multimedia.php?multimediaid=84">RCT2: Alton Towers Recreation 2005</a></li><li><a href="detail_multimedia.php?multimediaid=80">RCT2: Forbidden Valley 2003</a></li><li><a href="detail_multimedia.php?multimediaid=79">RCT2: Forbidden Valley 2003 Original</a></li><li><a href="detail_multimedia.php?multimediaid=85">RCT3: Alton Towers Custom Scenery Set Version 3</a></li><li><a href="detail_multimedia.php?multimediaid=143">Your Day Movie Trailer</a></li>	
    	
    		<br />
    		<br />
    		<div class="tab_blend2"></div>
    	</div>     
    	<!--------------------------------------------------------------------------------------------------------------------------------->       
    	<div id="tab7"><!--Start of tab 7-->
    		<img src="img/headings/links.jpg" class="heading" alt="Related Links" />
    		<p>
    			Any external links to do with Nemesis are shown below.
    		</p>
    		
    		<hr />
    		<br />
    
    		<ul class="styledlist"><p><li><a target="_blank" href="http://www.bolliger-mabillard.com">Bolliger & Mabillard</a></li></p></ul>
    
    		<br />
    		<br />
    		<div class="tab_blend2"></div>
    	</div>
    	<!--------------------------------------------------------------------------------------------------------------------------------->
    	<div id="tab8"><!--Start of tab 8-->
    		<img src="img/headings/comments.jpg" class="heading" alt="Comments" />
    		<p>
    			To add a comment of your own about Nemesis then please use the form at the bottom.
    		</p>
    
    		<hr />
    
    								<fieldset>
    							<legend>
    								<a href="mailto:rctneil@aol.com">
    									<b>
    										Neil									</b>
    								</a>
    								-
    								<img src="img/votestars/5star.gif" />
    							</legend>
    							<blockquote>
    								<p>Best ride on the earth! Just absolutley incredible! - Front seat for best visuals and back seat for extremely high forces! Definatley worth at least 2 or more rides each visit!</p>							</blockquote>
    						</fieldset>
    						<br />
    				
    		<hr />
    
    		<h1>
    			Submit Your Comment!
    		</h1>
    		<br />
    		
    		<div class="form_container">
    	<form action="" name="addcommentform" method="post">
    	
    			<label for="name">Name:</label>
    			<input id="name" name="name" type="text" value="" />
    
    		<br />
    		
    			<label for="email">E-Mail Address:</label>
    			<input id="email" name="email" type="text" value="" />
    
    		<br />
    
    			<label for="emailshow">Show E-Mail on site?:</label>
    			<input id="emailshow" name="emailshow" type="checkbox" checked="checked" />
    			
    		<br />
    		
    			<label for="rating">Rating:</label>
    			<input type="radio"	value="1star" id="rating" name="rating"  />
    			<img src="img/votestars/1star.gif" alt="1 Star Rating" />
    		<br />
    			<label>&nbsp;</label><input type="radio" value="2star" id="rating" name="rating"  />
    			<img src="img/votestars/2star.gif" alt="2 Star Rating" />
    		<br />	
    			<label>&nbsp;</label><input type="radio" value="3star" id="rating" name="rating"  />
    			<img src="img/votestars/3star.gif" alt="3 Star Rating" />
    		<br />	
    			<label>&nbsp;</label><input type="radio" value="4star" id="rating" name="rating"  />
    			<img src="img/votestars/4star.gif" alt="4 Star Rating" />
    		<br />
    			<label>&nbsp;</label><input type="radio" value="5star" id="rating" name="rating"  />
    			<img src="img/votestars/5star.gif" alt="5 Star Rating" />
    
    		<br />
    
    			<label for="comment">Comment:</label>
    			<label>&nbsp;</label><textarea cols="40" rows="8" id="comment" name="comment"></textarea>
    
    		<br />
    		<br />
    
    			<label>&nbsp;</label><input type="submit" value="Submit Comment" id="submit" name="submit" />
    			<label>&nbsp;</label><input type="reset" value="Reset Form" id="reset" name="reset" />
    
    	</form>
    </div>
    
    		<br />
    		<br />
    		<div class="tab_blend2"></div>
    	</div>
    	<!--------------------------------------------------------------------------------------------------------------------------------->
    </div>
    <!--------------------------------------------------------------------------------------------------------------------------------->
    <!--######################## - END PAGE CONTENT - ##################################-->
    
    <div id="insidefooter" style="text-align: center;">
    	<br /><br />
    	<hr />
    	<p><a href="#top">Top of Page</a> | Version 3.1 alpha</p>
    
    	<!--Code to remove the dotted line around ActiveX controls-->
    	<script type="text/javascript" src="swfobject.js"></script>
    	
    	<br /><br />
    	
    	<!--If live.txt exits then show infobox with link to admin panel-->
    			<div class="infobox">
    			<p style="text-align: center;">
    				<b>
    					DEVELOPMENTAL VERSION - <a href="admin/index.php" target="_blank">Admin Panel</a>
    				</b>
    			</p>
    		</div>
    		<br /><br />
    	<!-------------end--------->
    	
    </div><!--End Inside Footer-->
    
    </div><!--End Content-->
    
    
    <!--Pulls content div down around all the floats-->
    <div class="clearer"></div>
    
    </div><!--End Container-->
    
    <br /><br />
    
    <!--Adverts-->
    		<fieldset style="width: 600px; text-align: center; margin-left: auto; margin-right: auto;">
    			<legend>
    				Advertisements
    			</legend>
    			<!--Google AdSense-->
    			<script type="text/javascript"><!--
    google_ad_client = "pub-1527442551569821";
    /* 468x60, created 12/08/08 */
    google_ad_slot = "9627959331";
    google_ad_width = 468;
    google_ad_height = 60;
    //-->
    			</script>
    			<script type="text/javascript"
    src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
    			</script>
    			<!--End Google Adsense-->
    			<br />
    			<br />
    			<!--Attraction Tix Advert Banner-->
    			<a href="http://www.attractiontix.co.uk/alton-towers.asp" target="_blank"><img src="img/links/attraction_tix_banner.gif" alt="Alton Towers tickets at Attraction Tix" /></a>
    			<!--End Attraction Tix Advert Banner-->
    			<br />
    			<br />
    			<!--Better than Banners Advert-->
    			   			<!--End Better than Banners Advert-->
    		</fieldset>
    	<!--End Adverts-->
    
    </div><!--End Bigwrapper-->
    
    </body>
    </html>
    Thanks

    Regards,
    Neil

  12. #12
    dooby dooby doo silver trophybronze trophy
    spikeZ's Avatar
    Join Date
    Aug 2004
    Location
    Manchester UK
    Posts
    13,807
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    are you getting the relevant styles from the CSS? What is actually happening on your page?
    Mike Swiffin - Community Team Advisor
    Only a woman can read between the lines of a one word answer.....

  13. #13
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes the styles are being applied. I ahve changed them slightly though but yes they are being applied. It's just that when you click them the page moves down to the specific are on the page instead of hiding and showing the specific divs like it is meant to do

  14. #14
    dooby dooby doo silver trophybronze trophy
    spikeZ's Avatar
    Join Date
    Aug 2004
    Location
    Manchester UK
    Posts
    13,807
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    I think it might be script order....

    change.
    Code:
    <!--include javascripts-->
    <script src="javascripts/prototype.js" type="text/javascript"></script>
    <script src="javascripts/tabs.js" type="text/javascript"></script>
    <script src="javascripts/livepipe.js" type="text/javascript"></script>
    <!------------------------>
    to

    Code:
    <!--include javascripts-->
    <script src="javascripts/prototype.js" type="text/javascript"></script>
    <script src="javascripts/livepipe.js" type="text/javascript"></script>
    <script src="javascripts/tabs.js" type="text/javascript"></script>
    <!------------------------>
    Mike Swiffin - Community Team Advisor
    Only a woman can read between the lines of a one word answer.....

  15. #15
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thankyou so much, I would never have spotted that!

  16. #16
    dooby dooby doo silver trophybronze trophy
    spikeZ's Avatar
    Join Date
    Aug 2004
    Location
    Manchester UK
    Posts
    13,807
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    Yay - glad thats sorted
    Mike Swiffin - Community Team Advisor
    Only a woman can read between the lines of a one word answer.....

  17. #17
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Me too!

  18. #18
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    How can i chnage the text colour on the currently selected tab?

  19. #19
    dooby dooby doo silver trophybronze trophy
    spikeZ's Avatar
    Join Date
    Aug 2004
    Location
    Manchester UK
    Posts
    13,807
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    this bit
    Code:
    ul.subsection_tabs li.tab a.active {
    	background-color:#ddd;
    	color:#00ccff;
    }
    Mike Swiffin - Community Team Advisor
    Only a woman can read between the lines of a one word answer.....

  20. #20
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thats the part I changed but it doesn;t seem to make any difference

  21. #21
    dooby dooby doo silver trophybronze trophy
    spikeZ's Avatar
    Join Date
    Aug 2004
    Location
    Manchester UK
    Posts
    13,807
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    Just to force the issue with mine I changed it to

    Code:
    ul.subsection_tabs li.tab a {
    	display:block;
    	height:20px;
    	padding:0 6px 0 6px;
    	background-color:#012349;
    	color:#ff0000;
    }
    
    ul.subsection_tabs li.tab a:hover {
    	color:#00ff00;
    }
    
    ul.subsection_tabs li.tab a.active {
    	background-color:#ddd;
    	color: #0000ff;
    }
    which gives blue current, red link and green hover.
    Mike Swiffin - Community Team Advisor
    Only a woman can read between the lines of a one word answer.....

  22. #22
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That is stil not chnaging the text colour for me so I think I hve a conflict with my other stylesheets so I'll look through those tommorow

  23. #23
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hey Spikez,
    Just found a major issue which I hope you could help me sort out.

    The script does not seem to work in Safari at all.

    Is there a way to make it work correclty in Safari just like it does in Firefox, Opera and Internet Explorer

  24. #24
    dooby dooby doo silver trophybronze trophy
    spikeZ's Avatar
    Join Date
    Aug 2004
    Location
    Manchester UK
    Posts
    13,807
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    Have you got this online Neil? PM me a link if you dont want it public yet
    Mike Swiffin - Community Team Advisor
    Only a woman can read between the lines of a one word answer.....

  25. #25
    SitePoint Wizard rctneil's Avatar
    Join Date
    Jun 2005
    Posts
    1,891
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I don;t as it is a bit difficult to upload at the moment due to the way the site is built up but if you try the page of code you had first of all with the two simple tabs on their own in Safri, that also fails


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
  •