API tools faq
paste
View difference between Paste ID: g9iZhn7b and DjQiJd8H
SHOW: | | - or go back to the newest paste.
1
<html> <!-- STYLES -->
2
  <head>
3
    <style>
4
5
	#internet-explorer {
6
		margin-top: 0px;
7
		text-align: center;
8
		color: #C30;
9
		font-family: monospace;
10
		font-weight: bold;
11
	}
12
13
14
	/*----- HEADER -----*/

15
	#header {

16
		height: 200px;

17
		padding-bottom: 20px;

18
	}

19
	

20
	#headerTitle {

21
		text-align: right;

22
		font-weight: bold;

23
		font-size: 36px;

24
	}

25
26
	#logo {

27
		left: 20%;

28
		align: left;

29
		width: 120px;

30
		height: 120px;

31
	}

32
	

33
	#headerSubTitle {

34
		font-size: 14px;

35
		letter-spacing: 2px;

36
		color: #666;	

37
	}

38
	

39
	a#igem, a#igem:visited {

40
		color: inherit;

41
		text-decoration: none;	

42
	}

43
	

44
	a#igem:hover, a#igem:active {

45
		color: #F93;

46
		text-decoration: underline;	

47
	}

48
49
	/*----- HEADER BUTTONS -----*/

50
	.nav_button {

51
		bottom: 20%;

52
		display: table;

53
	}

54
	

55
	.nav_buttonText {

56
		color: #222;

57
		text-align: center;

58
		vertical-align: middle;

59
		display: table-cell;	

60
	}

61
	

62
	a.nav_buttonLink, a.nav_buttonLink:visited {

63
		text-decoration: none;	

64
                color: black;

65
	}

66
	a.nav_buttonLink:hover, a.nav_buttonLink:active {

67
		color: #F93;

68
		text-decoration: underline;

69
	}

70
71
	/*----- END OF BUTTONS -----*/

72
	

73
	/*----- END OF HEADER -----*/

74
75
	/*----- MAIN CONTENT -----*/

76
	

77
	.title-link, .title-link:active, .title-link:visited {

78
		text-decoration: none;

79
		color: inherit;

80
	}

81
 

82
	.title-link:hover {

83
                text-decoration: underline;

84
                color: #F93;

85
        }

86
	#first-panel {

87
		display: ;

88
		background: white;

89
		border:1px solid white;

90
		padding-left: 15px;

91
		-moz-border-radius-topright: 20px;

92
		-webkit-border-top-right-radius: 20px;

93
		-moz-border-radius-bottomright: 20px;

94
		-webkit-border-bottom-right-radius: 20px;

95
		width: 100%;

96
		height: auto;

97
	}

98
	

99
	#second-panel {

100
		display: none;

101
		background: white;

102
		border:1px solid white;

103
		padding-left: 15px;

104
		-moz-border-radius-topright: 20px;

105
		-webkit-border-top-right-radius: 20px;

106
		-moz-border-radius-bottomright: 20px;

107
		-webkit-border-bottom-right-radius: 20px;

108
		width: 100%;

109
		height: auto;

110
	}

111
	

112
	#third-panel {

113
		display: none;

114
		background: white;

115
		border:1px solid white;

116
		padding-left: 15px;

117
		-moz-border-radius-topright: 20px;

118
		-webkit-border-top-right-radius: 20px;

119
		-moz-border-radius-bottomright: 20px;

120
		-webkit-border-bottom-right-radius: 20px;

121
		width: 100%;

122
		height: auto;

123
	}

124
	

125
	#fourth-panel {

126
		display: none;

127
		background: white;

128
		border:1px solid white;

129
		padding-left: 15px;

130
		-moz-border-radius-topright: 20px;

131
		-webkit-border-top-right-radius: 20px;

132
		-moz-border-radius-bottomright: 20px;

133
		-webkit-border-bottom-right-radius: 20px;

134
		width: 100%;

135
		height: auto;

136
	}

137
	

138
	/*----- FIRST CONTENT -----*/

139
	

140
	/*----- SECOND CONTENT -----*/

141
	

142
	/*----- THIRD CONTENT -----*/

143
	

144
	/*----- FOURTH CONTENT -----*/	

145
	

146
	</style>

147
  </head>

148
</html>

149
150
<html>

151
  <head>

152
    

153
    <!-- FIRST BUTTON -->

154
	<script type="text/javascript">

155
	$(document).ready(function(){

156
	    $("#nav-button-link-first").click(function(){

157
	        $("#first-panel").toggle("fast");

158
			$("#second-panel").hide("fast");

159
			$("#third-panel").hide("fast");

160
			$("#fourth-panel").hide("fast");

161
	        $(this).toggleClass("active");

162
	        return false;

163
	    });

164
	});

165
	</script>

166
    

167
    <script type="text/javascript">

168
	$(document).ready(function(){

169
	    $("#first-title-link").click(function(){

170
	        $("#first-panel").toggle("fast");

171
			$("#second-panel").hide("fast");

172
			$("#third-panel").hide("fast");

173
			$("#fourth-panel").hide("fast");

174
	        $(this).toggleClass("active");

175
	        return false;

176
	    });

177
	});

178
	</script>

179
    

180
    <!-- SECOND BUTTON -->

181
    

182
    <script type="text/javascript">

183
	$(document).ready(function(){

184
	    $("#nav-button-link-second").click(function(){

185
	        $("#second-panel").toggle("fast");

186
			$("#first-panel").hide("fast");

187
			$("#third-panel").hide("fast");

188
			$("#fourth-panel").hide("fast");

189
	        $(this).toggleClass("active");

190
	        return false;

191
	    });

192
	});

193
	</script>

194
    

195
    <script type="text/javascript">

196
	$(document).ready(function(){

197
	    $("#second-title-link").click(function(){

198
	        $("#second-panel").toggle("fast");

199
			$("#first-panel").hide("fast");

200
			$("#third-panel").hide("fast");

201
			$("#fourth-panel").hide("fast");

202
	        $(this).toggleClass("active");

203
	        return false;

204
	    });

205
	});

206
	</script>

207
    

208
    <!-- THIRD BUTTON -->

209
    

210
    <script type="text/javascript">

211
	$(document).ready(function(){

212
	    $("#nav-button-link-third").click(function(){

213
	        $("#third-panel").toggle("fast");

214
			$("#first-panel").hide("fast");

215
			$("#second-panel").hide("fast");

216
			$("#fourth-panel").hide("fast");

217
	        $(this).toggleClass("active");

218
	        return false;

219
	    });

220
	});

221
	</script>

222
    

223
    <script type="text/javascript">

224
	$(document).ready(function(){

225
	    $("#third-title-link").click(function(){

226
	        $("#third-panel").toggle("fast");

227
			$("#first-panel").hide("fast");

228
			$("#second-panel").hide("fast");

229
			$("#fourth-panel").hide("fast");

230
	        $(this).toggleClass("active");

231
	        return false;

232
	    });

233
	});

234
	</script>

235
    

236
    <!-- FOURTH BUTTON -->

237
    

238
    <script type="text/javascript">

239
	$(document).ready(function(){

240
	    $("#nav-button-link-fourth").click(function(){

241
	        $("#fourth-panel").toggle("fast");

242
			$("#first-panel").hide("fast");

243
			$("#second-panel").hide("fast");

244
			$("#third-panel").hide("fast");

245
	        $(this).toggleClass("active");

246
	        return false;

247
	    });

248
	});

249
	</script>

250
    

251
    <script type="text/javascript">

252
	$(document).ready(function(){

253
	    $("#fourth-title-link").click(function(){

254
	        $("#fourth-panel").toggle("fast");

255
			$("#first-panel").hide("fast");

256
			$("#second-panel").hide("fast");

257
			$("#third-panel").hide("fast");

258
	        $(this).toggleClass("active");

259
	        return false;

260
	    });

261
	});

262
	</script>

263
  </head>

264
</html>

265
266
267
<html>

268
  <div id="header">

269
  <!--<img src="assets/logo.png" id="logo">-->

270
  <div id="headerTitle">

271
</html>

272
<center>SPS_London</center>

273
<html>

274
  </div>

275
</html>

276
277
<html>

278
<div id="headerSubTitle">

279
</html>

280
<center>TMNP Collective</center>

281
<html>

282
  </div>

283
  <div id="headerSubTitle">

284
</html>

285
<center>An <html><a id="igem"></html>iGEM<html></a></html> Team</center>

286
287
<html>

288
  </div>

289
    <!--[if gte IE 2 ]>

290
 		<p id="internet-explorer">This Wiki is designed for best use on <a href="https://www.google.com/intl/en_uk/chrome/browser/?hl=en-GB">Google Chrome</a> and <a href="https://www.mozilla.org/en-US/firefox/fx/#desktop">Mozilla Firefox</a>. Some key features are not available to your browser, please use a different browser or click <a href="">here</a>.</p>

291
    <![endif]-->

292
</html>

293
294
<center>

295
{| style="text-align: center; margin-left: 50px; width: 500px;"

296
|

297
<html>

298
  <a class="nav_buttonLink" id="nav-button-link-first" href="#first"><div class="nav_button" id="first"><p class="nav_buttonText">

299
HOME

300
</html>

301
<html>

302
  </p></div></a>

303
</html>

304
|

305
<html>

306
<a class="nav_buttonLink" id="nav-button-link-second" href="#second"><div class="nav_button" style="margin-left: 10px;" id="second"><p class="nav_buttonText">

307
</html>

308
PROJECT

309
<html>

310
  </p></div></a>

311
</html>

312
|

313
<html>

314
  <a class="nav_buttonLink" id="nav-button-link-third" href="#third"><div class="nav_button" id="third"><p class="nav_buttonText">

315
</html>

316
THE TEAM

317
<html>

318
  </p></div></a>

319
</html>

320
321
|

322
<html>

323
  <a class="nav_buttonLink" id="nav-button-link-fourth" href="#fourth"><div class="nav_button" id="fourth"><p class="nav_buttonText">

324
</html>

325
NOTEBOOK

326
<html>

327
  </p></div></a>

328
</html>

329
|-

330
|}

331-
</center>

331+
</center></div>

332
333
<html>

334
<a class="title-link" id="first-title-link" id="#first"><h3>first</h3></a>

335
    	<div id="first-panel">

336
        	<div class="nav-box">

337
            	<ul>

338
            	<li>Hi</li>

339
            	</ul>

340
            </div>

341
            

342
            <div class="panel-content">

343
	       		<p>this is all inside the first panel</p>

344
    		</div> <!--of panel content-->    

345
    	</div>

346
</html>

347
348
<html>

349
  <a class="title-link" id="first-title-link" id="#first"><h3>

350
</html>

351
Home

352
<html>

353
  </h3></a>

354
  <div id="first-panel">

355
</html>

356
hello

357
358
<html>

359
  </div>

360
</html>

361
*g

362
*g

363
*g

364
*g

365
*g

366
*g

367
*g

368
*g

369
*g

370
*g

371
*g
        

    


            


                                


        

            



                
    

        Public Pastes
    

    
            

    

                    

        

    





    


    
    
    
    
    
    
    
    




    


    



                

            We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.             OK, I Understand
        

    
                

            

                
                    
                
            

            

                Not a member of Pastebin yet?

                Sign Up, it unlocks many cool features!