I'm trying to code a menu which when clicking say the 'news' button, a div will appear to the right containing the news, if you then click the button below, say 'information', the news div will be replaced by the 'information' div. I can figure out how to make a single menu item show and hide a div, but I can't for the life of me figure out how to do it for a whole menu.
View 11 RepliesI expanded upon a script a friend helped me write, to create a simple check box that hides / shows content, as shown HERE. [URL] Unfortunately, I don't have a clue how to expand this, so that I can use more than one checkbox on the page, to open different sections.
<html>
<head>
<title>Title of page</title>
<script language="JavaScript">
function getCookie(NameOfCookie)
{ if (document.cookie.length > 0)
{ begin = document.cookie.indexOf(NameOfCookie+"=");
[Code]....
I have simple code which shows a div and then on click it hides the div but its not working:
Code:
hidediv(divID)
{
[code]....
This is my first little foray into JQuery, so far i'm impressed, having had very little JS experience, I was able to create the result. I wanted very qucikly and easily!
However, I'm having one little niggle...
Here's my code:
This works fine.. ticking the checkbox shows and hides the div. However, if I check the checkbox and refresh the page, the checkbox remains ticked, but the div is hidden. how I can make it work reliably?
We are looking to implement something similar to the navigation found at this site: [URL] When you click on ABOUT, CONTACT, or LAB, the appropriate div within the content-main div shows/hides as appropriate. Fancy. I'm happy to read up on this on my own, but I don't really know how they accomplished this, so I'm not sure what to research. Since the page doesn't refresh, I'm assuming AJAX may be involved? Most importantly, I'm very interested in how their URL structure works. It looks like #about is an anchor that they are linking to. I thought about doing it in PHP, which I'm more familiar with, but I'd rather not refresh the page if I don't have to.
View 9 Replies View Related1 - Accordion style vertical list that expands element (Film # and description) when "+more" link is clicked, and closes the previous open film and description.
2 - Activation of "+ more" shows a photo in separate div, and hides the previous photo that was visible in this separate div.
I have been on this for over an hours now, it is probably something simple and/or stupid, but why doesn't this script work? I have read forums til my eyes are crossed and can't see what I am doing wrong I am new to javascript, but not programming. The point here is to create a function that compares two strings and then shows or hides a div depending on the results of the comparison. I was trying to pass in the name of the two input text boxes containing the text and the name of the div to show or hide (so that it can be used in multiple scenariios.) Right now my error message is that document.getElementById(field1).value is not a function.
Here is the code below..
I've created a function that would hide and show paragraphs from a drop down list, that paragraph contains a link that will show a div containing a map of google. But when I switch to another State on the drop down list I'd like to have the original first paragraph that showed up to disappear. So far, I can only get the <div> that contains the map to disappear.a function that would hide the paragraph and the <div>? Again, Here's the code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>[code].....
[URL].. I have used some jQuery to hide two divs (#choices and #review) until a selection of "yes" or "no" is made. My problem is that as the page loads, these div's are displayed for a split second until the jQuery hides them. Can anyone tell me a better way or a fix for the existing code that I am using?
View 4 Replies View RelatedI've got my accordion working.The html and jq are as follows
<div class="nav">
<h3><div></div>
<h3><div></div>
<h3><div></div>etc..
</div>
$(document).ready(function() {
This hides all divs except the first one (check the site) on load, then whenever I click a h3, it performs as an accordion, sliding the hidden div down and other visible divs back upI want to add another functionality. I want it to be like, if you click on a h3, and the next div is already open, it will hide that div. else, it performs this function. This would be a basic if/else then wouldn't it? I'm new to jq but I've done mIRC scripting in the past and I don't know how the selectors work yet
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 RelatedI´m using the asp:menu control and the cycle plugin. No matter what I do, the drop down menu hides behind the slideshow. I´ve tried z-index, z-index !important, div-layout, table-layout, other slideshow plugins, different browsers (FF4, Chrome12, IE9).
View 3 Replies View RelatedI would like the menu1 text (test 1) to hide when i show my menu 2 text.
The script:
Code:
<script language="JavaScript" type="text/javascript">
<!--//
function showMenu(objMenu) {
if(document.getElementById(objMenu).style.display == 'none') {
[Code]....
This is the first time I work with jQuery [URL]. I have a little problem with my dropdown menu. As you see the orange dropdown menu shows up without using the mouse. I just want to make the dropdown pop out when you hover over the button.
This is the code.
The jQuery:
$(document).ready(function () {
$('#nav li').hover(
function () {
//show its submenu
$('ul', this).slideDown(200);
},
function () {
//hide its submenu
$('ul', this).slideUp(200);
});});
just wanted to know if there is a way to insert a code that shows how many users are viewing your page using javascript? i.e. 3 Users Online
View 4 Replies View Relatedprovide 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 wonder if it's possible to implement a menu like the one ofcbs.com?Basically, when mouse over some of the menu items, a menu panel shows up with a few columns of links. The many panel disappears when the mouse moves out. I think it's quite neat and I'm hoping to be able to do something like that with jQuery.
View 2 Replies View RelatedI am trying to use a jquery sliding top menu which i found here: [URL] and I have got this to work in the past on a website I built from scratch, but I am trying to build my website with wordpress, and I am having trouble getting it to work this time, it is going behind divs, and flying out too far.
View problem here: (the 'Log-in' tab at the top) [URL]
i want to implement something very similar to this (youtube).[URL]My javascript knowledges are low. I think it has something to be with onload and onclick events with links.Do i have to write a function and include it on the html page?Where do i have to put the diferent contents?I would prefer to separate html content and javascript since i have some variable to display from my template engine like {$name}, {$uploaded_date}, etc.
View 5 Replies View RelatedI have multiple divs something like this
<div id="div1">
<div id="div2">
<div id="div3">
[code]....
I want JavaScript code to print div1 with all nested divs as well I tried using the following code but it only print div1 content
var printContent = document.getElementById('div1');
var windowUrl = 'about:blank';
var uniqueName = new Date();
[code]...
My challenge is, that I am currently styling a 'old fashion' webshop, where everything is placed in multiple tables. And on a tight deadline ;o( I need to change the table-build menu, into div-elements, so i can style/minipulate as the design requires
[Code]...
I am trying to create a basic menu where if you put your mouse over a button you get a bit of descriptive text or an image appearing somewhere else on the page. I have tried to do this with hiding/revealing hidden divs - works fine with IE but no others.
<html>
<head>
<script language="javascript">
var descriptions = new Array();
descriptions[0] = "<p>See whats been added to the web site recently</p>";
descriptions[1] = "<p>Find out more about me</p>";
descriptions[2] = "<p>Check out me links</p>";
function showDescription(descriptionIndex){ .....
I'm trying to implement a show/hide toggle for each users profile field in the view body topic of my forum.
I found this thread here @ sitepoint which is close to what I'm working on, but the code I'm working with is different.
What I need are some changes to the JS so that each show/hide works independently, not just the first instance of the show/hide.
How do you call this HTML
Code:
With this JS to be independent?
Code:
I know that this would have bits of " $(function() and $(this) " but that's about all I know...
I want a menu at the top of the page. When I press a button in the menu the content of the page slides up, the content changes and it slides down. I've done this so far, but how can I do a more dynamic solution without having different divs for each menu item?
JS:
<script type="text/javascript" src="[URL]"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
$('#f1').click(function() {
a("1");
});
$('#f2').click(function() {
a("2");
});
$('#f3').click(function() {
a("3");
});
function a(info) {
$('#content').slideUp("normal");
document.getElementById('content').innerHTML = info;
$('#content').slideDown("normal");
};
});
</script>
HTML:
<div id="f1"><a href="#">Menu 1</a></div>
<div id="f2"><a href="#">Menu 2</a></div>
<div id="f3"><a href="#">Menu 3</a></div>
<div id="content">Chose something in the menu</div>
I am developing a menu using javascript wherein, I expand and collapse divs. It works fine individually; but the problem arises when I try to hide all other divs on expanding one div. Following is the code. any change if you spot any error or even
<head>
<script>
function hideDivs(){
var arr = document.getElementsByTagName('div')
[Code]....
Trying to get the divs to switch style properties when selected form select menu
<script type="text/javascript">
function showstuff(element){
if(document.getElementById(element).style.display = 'block')
[code].....