Dreamweaver Club Forums

Dreamweaver Club Forums (http://www.dreamweaverclub.com/forum//index.php)
-   Spry (http://www.dreamweaverclub.com/forum//forumdisplay.php?f=189)
-   -   collapsible panels - adding more than one list item? (http://www.dreamweaverclub.com/forum//showthread.php?t=49472)

benjamin_wooten 02-04-2017 08:15 PM

collapsible panels - adding more than one list item?
 
Hi! I know this is an awfully silly question, but it has been over ten years since I have used Dreamweaver to build a website.

I am doing an extremely simple sidebar with a couple of spry collapsible panels. At least one of these panels ("PROJECTS") is meant to include a vertical list of the various projects by name, so that you can click on the heading, then scroll down the list of project names, and click on one of those/link to the page for that project.

Every time I make a collapsible panel, I can only have one line of text underneath it.

How do I add more under that? And can they be turned into individual links?

Thanks all for the help!

edbr 02-04-2017 10:28 PM

if its just a drop down it can be achieved without using javascript. spry is a bit dead . if you want code i can oblige tomorrow

benjamin_wooten 02-05-2017 12:29 AM

Thanks very much for the response! I am able to do the list under a single menu by using page breaks to separate the names of the projects.

I would certainly be interested in seeing your code, too, if it is handy? No need to go out of your way otherwise.

Thanks again!

edbr 02-05-2017 04:47 AM

ok i will post qhen im at a desktop tomorrow

edbr 02-06-2017 12:54 AM

ok a very simple sidebar deop down i hashed together for my snippets, its st to display active category based on body id.
Code:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>menu</title>
<style>

ul{        list-style:none;
        position:relative;        float:left;        margin:0;        padding:0}
        ul li { clear:both;}

 ul a{        display:block;        color:#333;        text-decoration:none;
        line-height:32px;        padding:0 15px;}

 ul li{        position:relative;        float:left;        margin:0;        padding:0; clear:both}

 ul li a:link{        background:#f6f6f6}

 ul ul{        display:none;        position: relative ;        left:0;        background:#fff; clear:both;
        padding:0}

ul ul li{        float:none;        width:200px}

 ul ul a{        line-height:120%;        padding:10px 15px}

 ul ul ul{        top:0;        left:100%}

 ul li:hover > ul{        display:block}

<!--The hilite code-->
body.home  ul li a:link.home,
body.about ul li a:link.about,
body.services u l li a:link.services,
body.products ul li a:link.products,
body.contact ul li a:link.contact {
  background-color: red ;  }
</style>
</head>
<body class="about">
<h1>CSS Drop Down Menu</h1>
<div>
<ul>
  <li><a  class="home" href="#">Home</a></li>
  <li ><a class="services" href="#">Services</a>
    <ul>
      <li><a href="#">Sub Menu 1</a></li>
      <li><a href="#">Sub Menu 2</a></li>
      <li><a href="#">Sub Menu 3</a></li>
      <li><a href="#">Sub Menu 4</a>
        <ul>
          <li><a href="#">Deep Menu 1</a>
            <ul>
              <li><a href="#">Sub Deep 1</a></li>
              <li><a href="#">Sub Deep 2</a></li>
              <li><a href="#">Sub Deep 3</a></li>
                <li><a href="#">Sub Deep 4</a></li>
            </ul>
          </li>
        <li class="Deep Menu 2"><a href="#">Deep Menu 2</a></li>
        </ul>
      </li>
      <li><a href="#">Sub Menu 5</a></li>
    </ul>
  </li>  <!--  end services-->
 
 
  <li><a class="about" href="#">About</a>
    <ul>
      <li><a href="#">Sub Menu 1</a></li>
      <li><a href="#">Sub Menu 2</a></li>
      <li><a href="#">Sub Menu 3</a></li>
    </ul>
  </li>
  <li><a class="products" href="#">Products</a>
    <ul>
      <li><a href="#">Sub Menu 1</a></li>
      <li><a href="#">Sub Menu 2 THIS IS SO LONG IT MIGHT CAUSE AN ISSEUE BUT MAYBE NOT?</a>
        <ul>
          <li><a href="#">Category 1</a></li>
          <li><a href="#">Category 2</a></li>
          <li><a href="#">Category 3</a></li>
          <li><a href="#">Category 4</a></li>
          <li><a href="#">Category 5</a></li>
        </ul>
      </li>
      <li><a href="#">Sub Menu 3</a></li>
      <li><a href="#">Sub Menu 4</a></li>
      <li><a href="#">Sub Menu 5</a></li>
    </ul>
  </li>  <!-- end products-->
  <li><a class="contact" href="#">Contact Us</a></li>
</ul>
</div>
</body>
</html><!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>

<body>
</body>
</html>



All times are GMT. The time now is 11:53 AM.

Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Copyright 2006 DreamweaverClub.com