I have this code that I found online and I'm trying to figure out how to make this collapsable menu open collapsed when the page opens up.
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
[code]....
I have the code below that gives the ability to open and collapse sections.I don't know too much javascript and found this code online. I tweaked it to serve my purposes but it doesn't do one thing. I would like all of the areas to be collapsed when the page is opened.How would I tweak the code below to do that?
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
[code]....
This is a vertical collaps menu I made:
<html>
<head>
<script language='javascript1.2'>
//Scrit Name:Collapsable Menu V2.0
//Created By:Garadon
//E-Mail:Shashalak@hotmail.com
//Homepage:www.the-hive.dk/~donp/
function expand(value)
{
var antal=3;
var i=value;
var move=document.getElementById(i).clientHeight;
if(document.getElementById(value).style.visibility=='visible')
{
document.getElementById(value).style.visibility='hidden'
while(i!=antal)
{
i++;
document.getElementById(i+'t').style.pixelTop=document.getElementById(i+'t').style.pixelTop-move;
}
}
else
{
document.getElementById(value).style.visibility='visible'
while(i!=antal)
{
i++;
document.getElementById(i+'t').style.pixelTop=document.getElementById(i+'t').style.pixelTop+move;
}
}
}
</script>
</head>
<body bgColor=Black Text=yellow >
<table cellspacing=0 cellpadding=0 border=0 id=1t style='position:absolute;left:0px;top:5px;width:150px'>
<tr>
<td colspan=2 onClick="expand(1);" bgColor='#555555'>
<B>
Test1
</B>
</td>
</tr>
<tr>
<td bgColor='#000000'>
<table Border=0 bgColor='#333333' style='width:100%;visibility:hidden' id=1>
<tr>
<td>
Test1
</td>
</tr>
<tr>
<td>
Test1
</td>
</tr>
<tr>
<td>
Test1
</td>
</tr>
</table>
</td>
</tr>
</table>
<table cellspacing=0 cellpadding=0 border=0 id=2t style='position:absolute;left:0px;top:24px;width:150px'>
<tr>
<td colspan=2 onClick="expand(2);" bgColor='#555555'>
<B>
Test2
</B>
</td>
</tr>
<tr>
<td bgColor='#000000'>
<table Border=0 bgColor='#333333' style='width:100%;visibility:hidden' id=2>
<tr>
<td>
Test2
</td>
</tr>
<tr>
<td>
Test2
</td>
</tr>
</table>
</td>
</tr>
</table>
<table cellspacing=0 cellpadding=0 border=0 id=3t style='position:absolute;left:0px;top:43px;width:150px'>
<tr>
<td colspan=2 onClick="expand(3);" bgColor='#555555'>
<B>
Test3
</B>
</td>
</tr>
<tr>
<td bgColor='#000000'>
<table Border=0 bgColor='#333333' style='width:100%;visibility:hidden' id=3>
<tr>
<td>
Test3
</td>
</tr>
<tr>
<td>
Test3
</td>
</tr>
<tr>
<td>
Test3
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
I'm trying to achieve a notification feature which you see on facebook, myspace and so on. Here the trick that I use:I've pulled a number of data that a user has not been read (where active ='0') from a database to display on a notification icon on the menubar -- the exact notification icon you will see on facebook and myspace -- says 2 unread messages in bright red.As the user click on the notification button to open up a dropdown menu and read their unread messages I process the script and update the active = '0' to active = '1' and refresh the page.The problem is when the page is refreshed, the dropdown menu and the notification both disappeared.How do I remove only that number in red and keep the dropdown menu open, I know that both facebook and myspace didn't even refresh a page.In this case, I don't even know whether I use javascript or ajax. I've stolen (borrowed) the feature from twitter.
View 1 Replies View RelatedI have created a jquery accordion menu for a brilliant CMS called 'Concrete5' and all works lovely BUT I now would like the menu to stay open if a menu item is selected within the drop list.I have manged to create the following.....
var pathname = window.location.pathname;
var selecteda = $(".nav-selected a").attr("href");
// alert (selecteda)
[code]....
..but it doesn't seem to work.I'm not a JQuery GOD like most of you on here but I am trying my hardest The accordion menu I am trying to get this to happen on is Accordion Menu.
The purpose of the code is to slideToggle open one of two hidden sub-nav bars when either of two different menu items are clicked upon - instead of a drop down menu. What doesn't work is the hiding of the div that is not required, if it is already open. Viewing in firebug shows that the appropriate classes are being applied - I suspect the reason is that slideToggle has been somehow set and cannot be unset via another object - but perhaps that is not it at all?
$(document).ready(function() {
//add .toggle function to appropriate li element
$('#hozmenu li:nth-child(4)').toggle(function () {
//set 4th menu links colour to be green whilst div is shown
$('#hozmenu li:nth-child(4) a').css('color', '#95d890');
$('#toggle_nav_services').removeClass('toggle_show');
[Code]....
I am trying to use the Jquery selecmenu to skin dropdowns.There are extra UL LI getting formed with data "undefined" so dropdown is showing undefined in end.
View 1 Replies View RelatedAny there any way to make the familiar expanding/collapsing banner ads found on sites like CNET, ZDNet, etc. in JavaScript without having to use Flash? The only thing on the web I've found....
View 14 Replies View Relatedi just found this jquery script for collapsable panels : [URL] it works fine for me, but the problem is that i have to write all the ID's from the DIV's into the script before. i got a page with a lot auf these panels and i dont want to write every ID in the script. is there any posibility to have only one scipt and when i click one panel it regognize on which i clicked? so i dont want to have the ID's in the script.
this is the script:
$(function()
{
$("#mostrar").click(function(event) {
event.preventDefault();
[Code]....
I am trying to develop a div with a drop down menu in it. As the enduser selects the third or final option, the div expands to show more choices/text/etc related to the option selected from the drop down menu..
View 5 Replies View RelatedSay I have a tree view
Item1
SubItem1
Element1
Element2
[Code]....
When I do a search in the browser (Ctl+F)(with Item2 collapsed) on Element1 the search stops on Item1|Subitem1|Element1 then Item1|Subitem2|Element1. If continue searching it does not find Item2|Subitem2|Element1.
Is there a way for the search to even find collapsed items?
When the left column first loads the vertical scrollbar displays correctly.
The vertical scrollbar is aligned up against the right border of the first column of the table which you can see by looking at the first image, and comparing it to the second.
Once I click on a folder in order to expand its contents, the vertical scrollbar introduces a gap of about 20 pixels as shown in the circle.
I looked at the css tag for the "classes" folder using firebug, and it showed {class ="directory collapsed", class= "directory expanded"} prior to and after expanding the contents of the folder.
I did a global regex search, within the project hierarchy, for (collapsed|expanded) and could not find any css that showed any margin-right for expanded, nor could I find any css at all related to "directory (collapsed|expanded)".
The only thing I found was that jqueryFileTree.js contained a function bindTree(t) with some code that toggled (collapsed|expanded):
Does anybody have a clue what is causing the gap once I click on a folder, and how to fix the problem?
Even if close the folder once the gap is there, I can't get rid of it unless I reload the page.
I need a script that can open an external page, or some type of content, in a box. This is kind of hard to explain, but here's what I mean, go to facepunch . com (I'm not a spambot dammit) and click on that litte face at the top.
View 1 Replies View RelatedI've got an question about a 'accordion menu',When I add a 'current' class to my list item,
<ul id="TEST">
<li><a href="#">Example 1</a>
<ul>
[code]....
[URL] and you can see the code there, but essentially I'm wondering if there is a way to open (I know there is, I just can't) the superfish menu plugin "up" rather than down which it does by default. I think it's a css/jQuery animation issue but I can't seem to get it.
View 3 Replies View RelatedI want to make it so that when you go to type something into the textbox(lastname or firstname) the menu stays open. right now if you try and type something into the textbox the menu closes but you still keep right on writing and then go back into the menu and click the submit button. I also want it so that you can press the <enter> key on your keyboard and it will submit the search query that you are working on.code...
View 2 Replies View RelatedI found a menu that operates like I want it to (except it needs to open to the left, instead of the right), but no matter how I put the code into my page, it just screws the page up.....terribly. I have been trying to get a similar menu to work (anylinkmenu), but it is not very good, so I want to use this one instead.
I need the menu to open to the left of the "Facebook" icon at the top of my page in the header. I have put all the code on here below (only the code for the actual menu...not for jquery-1.3.2.min.js or jquery.ui-1.7.min.js.
[Code]...
I mainly do PHP/MySQL coding, but I wanted to add this Javascript Accordion Menu to my site:
Javascript And CSS Tutorial - Accordion Menus | Switch on the Code [URL]
It works fine, but I was wondering if there was a simple way to modify the code so that the currently open menu stays open from page to page instead of closing upon each page reload?
i'm using php include for the left product menu at [URL]
however, when a specific category is clicked on, i would like the menu to stay expand when the page loads.
I have a jump menu on my page and it works fine, but I want the selections in the menu to open in a new browser window. How do I do that?
<script>
function MM_jumpMenu(targ,selObj,restore){ //v3.0
eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
if (restore) selObj.selectedIndex=0;
}
//-->
</script>
<form name="form1" method="post" action="">
<div align="right"><select name="form1" class="box" onChange="MM_jumpMenu('parent',this,0)">
<option value=http://www.1stoption.com>-- Option 1</option>
<option value=http://www.2ndoption.com>-- Option 2</option>
</select>
</div>
</form>
provide me with code to make a collapsible menu? What I'm looking for is a vertical menu, that will open up the sub-categories upon a mouseover. Clicking on the menu item will bring them to the specific page. Oh, and this might not matter, but I'd prefer if I was able to style the menu to fit with my site theme.
View 2 Replies View RelatedI'm using the fgMenu plugin [URL] to style our select menus. Does anyone know how to force the menu to open beneath where the menu is clicked to be opened? If you click on the first menu here ...
[URL]
you will notice that the menu opens above the click, and the top part is cut off. I would prefer the menu opens below the click, and someone can scroll to see all options.
How to add sub menus that should appear on mouse click and should disappear on mouse click.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
[code]....
I have this list menu that needs to pop open a blank window in front of the already open webpage. It also needs to work in IE and hopefully Firefox if possible.[code]
View 1 Replies View RelatedI have a menu with some items containing a submenu. The submenu's should open when a parent is clicked and contains submenu's, and when traveling to another page (from the item clicked, for example a parent of submenu item), the submenu should remain active and visible. When I click on a parent (at the moment the hrefs contain no links just #), the submenu opens. But when I click another main item, the submenu of the previous parent remain visible, and the submenu of the parent just clicked is also visible, while I only want the submenu of the parent clicked to be visible or when parent with no submenu the submenu should be invisible.
So, here is the code I have so far:
Code:
<div id="topnav">
<ul>
<li>
<a href="index.html">Home</a>
[Code]....
I have a javascript menu based off of unordered lists that only shows the subnav links when you click on the main nav links. is there a way to keep any subnav items open after you click on a link and are transferred to a new page? Code:
View 3 Replies View Related