Tycoon Talk
Become a Big fish!
The number 1 forum for online business!
Post topics, ask questions, share your knowledge.
Tycoon Talk is part of Freelancer.com - find skilled workers online at a fraction of the cost.

JavaScript Forum


You are currently viewing our JavaScript Forum as a guest. Please register to participate.
Login



Reply
Common Content Script
Old 05-23-2009, 04:56 PM Common Content Script
wildbackpacker's Avatar
Extreme Talker

Posts: 162
Name: Colton
Location: Utah, USA
Trades: 0
I am trying to put a accordion just like Dezinerfolio's onto a high school's new website within each department so that you can click on each teacher and it will give some short information on the right side. The thing is though that I don't want them all on external pages, but rather all the information on that page.There isn't a sample up there right now, but I think the style sheets from the accordion and my pages are conflicting and it doesn't work correctly. Is there another script like this to load content?
__________________
Colton
Wild Backpacker

Please login or register to view this content. Registration is FREE

Last edited by wildbackpacker; 05-23-2009 at 05:02 PM..
wildbackpacker is offline
Reply With Quote
View Public Profile Visit wildbackpacker's homepage!
 
 
Register now for full access!
Old 05-26-2009, 11:06 AM Re: Common Content Script
Novice Talker

Posts: 14
Location: UK,England,Essex
Trades: 0
that menu is done in CSS-P Element

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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Simple Javascript Accordions - by www.dezinerfolio.com</title>
<style type="text/css">
* {
 margin:0;
 padding:0;
 list-style:none;
}
body {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 11px;
 margin:10px;
}
#basic-accordian{
 border:5px solid #EEE;
 padding:5px;
 width:375px;
 position:absolute;
 left:50%;
 top:50%;
 margin-left:-175px;
 z-index:2;
 margin-top:-100px;
}
.accordion_headings{
 padding:5px;
 background:#99CC00;
 color:#FFFFFF;
 border:1px solid #FFF;
 cursor:pointer;
 font-weight:bold;
}
.accordion_headings:hover{
 background:#00CCFF;
}
.accordion_child{
 padding:15px;
 background:#EEE;
}
.header_highlight{
 background:#00CCFF;
}
</style>
<script type="text/javascript" src="accordian.pack.js"></script>
</head>
<body onload="new Accordian('basic-accordian',5,'header_highlight');">
 
<div id="basic-accordian" ><!--Parent of the Accordion-->
<div align="center">Left Navigation</div>
<div style="width:125px; float:left">
  <div id="test1-header" class="accordion_headings header_highlight" >Home</div>
  <div id="test2-header" class="accordion_headings" >About Us</div>
  <div id="test3-header" class="accordion_headings" >Download</div>
</div>
<div style="float:right; width:250px;">
  <div id="test1-content">
 <div class="accordion_child">
     Welcome to the Homepage<br /><br />Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc sapien nibh, ultrices vitae, convallis eu, semper ut, leo. Cras nec pede.
    </div>
  </div>
 
  <div id="test2-content">
 <div class="accordion_child">
     Here you will find more about us<br /><br />Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc sapien nibh, ultrices vitae, convallis eu, semper ut, leo. Cras nec pede.
    </div>
  </div>
 
  <div id="test3-content">
 <div class="accordion_child">
     and... this is the download section<br /><br />Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc sapien nibh, ultrices vitae, convallis eu, semper ut, leo. Cras nec pede.
    </div>
  </div>
</div>
 
 
<a href="02.html" style="float:left">Previous Demo</a>
<a href="04.html" style="float:right;">Next Demo</a>
 
</div><!--End of accordion parent-->
 
 
</body>
</html>
Code for the css for it
Code:
<style type="text/css">
* {
 margin:0;
 padding:0;
 list-style:none;
}
body {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 11px;
 margin:10px;
}
#basic-accordian{
 border:5px solid #EEE;
 padding:5px;
 width:375px;
 position:absolute;
 left:50%;
 top:50%;
 margin-left:-175px;
 z-index:2;
 margin-top:-100px;
}
.accordion_headings{
 padding:5px;
 background:#99CC00;
 color:#FFFFFF;
 border:1px solid #FFF;
 cursor:pointer;
 font-weight:bold;
}
.accordion_headings:hover{
 background:#00CCFF;
}
.accordion_child{
 padding:15px;
 background:#EEE;
}
.header_highlight{
 background:#00CCFF;
}
</style>
burnsyy is offline
Reply With Quote
View Public Profile
 
Old 05-26-2009, 03:12 PM Re: Common Content Script
wildbackpacker's Avatar
Extreme Talker

Posts: 162
Name: Colton
Location: Utah, USA
Trades: 0
Thanks burnsyy, but I did find a script afterall. Although, I just realized it isn't compatible in IE. Not good. http://www.webmaster-talk.com/javasc...e-with-ie.html
__________________
Colton
Wild Backpacker

Please login or register to view this content. Registration is FREE
wildbackpacker is offline
Reply With Quote
View Public Profile Visit wildbackpacker's homepage!
 
Reply     « Reply to Common Content Script
 

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off





   
RSS Feed  Feeds: RSS   JS   XML
RSS Feed  Feeds for this forum: RSS   JS   XML



Page generated in 0.11137 seconds with 12 queries