visual css sitemaps

welshstew · #1 (**permalink**) Aug 21st, 2007, 14:26

Hi all,

I was wondering if anyone has had any experiance with creating visual css sitemaps.

I am looking at creating something along the lines of Scott Jehl's visual css/html site map and was wondering if anyone has had success in implementing something like this.

Ideally I want this solution, but with the ability to roll up the sitemap, as our site is pretty big!

Anyone got anything that they can show me?

Cheers for any assistance.

Stew

karinne · #2 (**permalink**) Aug 21st, 2007, 14:30

Hmmm ... it looks pretty straight forward to me?! Did you copy the code at the bottom of that page?

What does your code look like?!

welshstew · #3 (**permalink**) Aug 21st, 2007, 15:07

I can get it to look like the example, but just can't get the functionality to roll up and down when you click on the boxes. i.e. when you click on portfolio I want all that is underneath it to dissappear

My page code is below and css and js for the site map is per the demo on Scott's site.

Code: Select all

<%@LANGUAGE="VBSCRIPT"%>
<!-- #include virtual="/template/includes/1constants.asp" -->
<%
    ' set the title element for the current page
    strPageTitle = "Test sitemap"
    ' set left hand menu for the current page
    intMenuTopId = 101        
    intMenuTopSubId = 106    
    intMenuSideExpId = 111    
    intMenuSideId = 114        
%>
<!-- #include virtual="/template/includes/svrfunctions.asp" -->
<!-- #include virtual="/template/includes/definenav.asp" -->
<!-- #include virtual="/template/includes/2doctypehtml.asp" -->
<!-- #include virtual="/template/includes/3.1openhead.asp" -->
<meta name="description" content="test sitemap"/>
<meta name="keywords" content="test sitemap"/>
<link rel="stylesheet" type="text/css" href="/css/styleMap.css" />
<script src="/script/styleMap.js" type="text/javascript" charset="utf-8"></script>
<!-- #include virtual="/template/includes/3.2closehead.asp" -->
<body>
<!-- #include virtual="/template/includes/4layout.html" -->
<!-- #include virtual="/template/includes/top_navigation.asp" -->
<!-- #include virtual="/template/includes/6layout.asp" -->
<!-- #include virtual="/template/includes/7leftnav.asp" -->
<!-- #include virtual="/template/includes/8layout.asp" -->
<!-- page content -->
<div id="contain">

    <ul id="sitemap">

        <li><div><a href="#">Home</a></div>

            <ul>

                <li><div><a href="#">About</a></div></li>

                <li><div><a href="#">Portfolio</a></div>

                    <ul>

                        <li><div><a href="#">Print</a></div></li>

                        <li><div><a href="#">Web</a></div>

                            <ul>

                                <li><div><a href="#">Sites</a></div></li>

                                <li><div><a href="#">Apps</a></div></li>

                            </ul> 

                        </li>

                        <li><div><a href="#">Video</a></div></li>

                        <li><div><a href="#">Animation</a></div></li>

                    </ul>

                </li>

                <li><div><a href="#">Contact</a></div></li>

            </ul>

        </li>

    </ul>

 </div>    

<!-- /page content -->
<!-- #include virtual="/template/includes/9layout.asp" -->
<!-- #include virtual="/template/includes/10footer.asp" -->
<!-- #include virtual="/template/includes/11layout.asp" -->

At this point I'm looking at a show/hide div layer for each 'block' of the sitemap, but that won't lend itself well to when the js is turned off.

Any ideas on how to achieve an 'acordian / sliding doors' type effect onto this visual sitemap?

karinne · #4 (**permalink**) Aug 21st, 2007, 16:49

Just to clear things up ... the original (the one you linked) doesn't do this right?

welshstew · #5 (**permalink**) Aug 21st, 2007, 16:58

Not that I can see.

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
SEO and Sitemaps	prizm	Search Engine Optimization (SEO)	5	Nov 3rd, 2007 22:49
sitemaps	octoberward	Starting Out	3	Aug 2nd, 2007 15:11
Sitemaps needed	qwertypunk	Web Page Design	7	Aug 14th, 2006 16:39

		Webforumz.com > Main Forums > Design Your Website > Web Page Design
visual css sitemaps