I wrote below code for Collapse/Expand some sections. It is working fine. Finally If I click "Save" button and I am re-loading (refresh)page again( code in asp.net). So then sections are going default Colleapse again. I need them back to expand sections. I mean what ever user expanded should me expanded again after refresh page. How can I do that?
$
(
function
()[code].....
I realize that expanding/collapsing DIV scripts are common but I can't find one suitable for my code. Most of them seem to rely on a unique DIV ID. I have the following XHTML code on my page.
Code:
<div id="container">
<h1>List of Events Happening:</h1>
<div class="event">
<div class="eventtitle">
<h1>Event 1</h1>
<p><a href="#">[ expand++ ]</a></p>
</div>
<div class="eventbody">
<!-- stuff -->
</div>
</div>
<div class="event">
<div class="eventtitle">
<h1>Event 2</h1>
<p><a href="#">[ expand++ ]</a></p>
</div>
<div class="eventbody">
<!-- stuff -->
</div>
</div>
<div class="event">
<div class="eventtitle">
<h1>Event 3</h1>
<p><a href="#">[ expand++ ]</a></p>
</div>
<div class="eventbody">
<!-- stuff -->
</div>
</div>
<!-- etc. -->
Basically I want my link to expand the .eventbody for the particular .event and there could be an unlimited number of .events. I'm not sure how to go about achieving this. I've already got a script that toggles the display(block or none) for a DIV, but it relies on a specific DIV ID.
I want to add a + - for collapse and expand all. I would prefer to have them change accordingly but it isn't necessary.
This is my javascript:
var toggleMenu = {
init : function(sContainerClass, sHiddenClass) {
if (!document.getElementById || !document.createTextNode) {return;} // Check for DOM support
var arrMenus = this.getElementsByClassName(document, 'ul', sContainerClass);
var arrSubMenus, oSubMenu, oLink;
for (var i = 0; i < arrMenus.length; i++) {
arrSubMenus = arrMenus[i].getElementsByTagName('ul');
for (var j = 0; j < arrSubMenus.length; j++) {
oSubMenu = arrSubMenus[j]; .....
This is my html code:
<script type="text/javascript">
function MM_showHideLayers() { //v9.0
var i,p,v,obj,args=MM_showHideLayers.arguments;
for (i=0; i<(args.length-2); i+=3)
with (document) if (getElementById && ((obj=getElementById(args[i]))!=null)) { v=args[i+2];
if (obj.style) { obj=obj.style; v=(v=='show')?'visible'v=='hide')?'hidden':v; }
obj.visibility=v; }
}
</script> .....
the scripts i made is for a search box , the problem is that the search lists does not expand over the page. its just moving the page more down. this is the script:
<script type="text/javascript">
function lookup(inputString) {
if(inputString.length < 1) {
[code]....
I have a vertical menu at the left of my site. When you click on the main elements, they expand with jquery to show sub-elements.The problem is the menu expanded is longer than the page and it doesn't expand the page at the same time, so it goes over the bottom of the page.How do I expand the page at the same time?
View 6 Replies View RelatedI have a problem where the page doesn't expand when more results get loaded via jquery on a facebook style wall. Once more results get loaded the footer stays static instead of moving down.
What's the best way to do this?
I have a page with two divs on it, <div id="left"> and <div id="right"> . On my page, there are times when the right div is not displayed as there is no content in it, how can I get jquery to detect that div id="right" does not exist on a page so make the width of the left div to 1200px.
This is what ive found, but im not sure length is what I should be using to calculate if a div exists or not:
[Code]...
So its kind of complicated what I'm going to try and explain but here goes... I have a two column layout that has a thin column on the left for the menu and then a wider column on the right hand side for content.
Now the problem is that when the height content of the right hand column surpases that of the menu (left column) then I get the content that is supposed to be in the right column shifting to underneath the menu - which I do not want....
CSS:
.leftcol{
text-align: left;
color: #333333;
float: left;
width: 25%;
max-height: 100%;
}
.rightcol{
width: 100%;
text-align: left;
}
Does anyone know of any javascript that would make the height of the menu div expand to that of the content div or have any better solutions?
I have this code
Wich works fine. The problem here is that every time the field #isbn in changed the code isn't executed again until I reload the entire page.
I started some programming with Javascript.I'd like to use it to expand/collapse some headers in a page. I made following code to do this.:collapse-expand.txt.That works perfect!But I want to add something, and I have some problems with that. As I have e.g. 4 headers, I want to expand the text (in <p>-tag) by clicking on header 1. When I click on header 2, I want to collapse text of header 1 and expand header 2 text.And so on.That way, I get the height of the site relatively small without needing to scroll.I don't quite know how to implement this function into my JS-code!And if it could be implemented in my .js file, how do I link that in my html, because now I have in every header the same line:<a href="#first" onClick="shoh('first');">, <a href="#second" onClick="shoh('first');">, etc..How can I get the content of header 1 be seen as soon as the screen pops up. So you don't have to click on Header1 before you can see it? And then go on from there: clicking on header2 makes text of header 1 disappear and expands text from header 2, and so on.
View 24 Replies View RelatedI need to do multi DOM manipulation into a page without reload it (something like: when i click on a thum in another part load a photo with a specific text, if i click on this text load another photo).
I use a js like:
First page loading everything goes good.... but when i fall into MY_CODE1, i can't execute MY_CODE2 anymore.....
I'm new to jQuery and javascript but already very impressed with jQuery.I have a page divided in two columns (divs). When one clicks on the links in one column, it loads the php page in the other column. I have this working, but what i would like to do is that not only would it load the php page in the other column but also automatically scroll to an anchor in that php page
View 2 Replies View RelatedI have an existing jquery/ajax script that does a click function. After the click function, I need to reload a div on the same page.Isnt there a simple line of jquery that would reload a div? below is the click function. lets say i want to reload a div with id="lesson" after the click.
[Code]...
I have the following problem: In wordpress I wanted to popup the login-page (wp-login.php) and i used the fancybox to generate an iframe. after clicking the "login" button i want that the fancybox is closing (thats not the problem) and i want to reload the whole page so that it recognizes that i'm logged in.
Now that is the problem .. I cant reload the index page when clicking the login button, because (i think so) the login document is in a iframe and is not able to reload the whole screen). I don't know the "reload" command, too, maybe load("index.php"); ? :D
I have got tabs working great and have set up a rotate every 5 seconds but whenever it loads a new tab (either by clicking a link or rotating to it) it moves up to the top of the page as if it was following an anchor.
View 2 Replies View RelatedI am loading a page dynamically using .load with jquery and then i have another button on that page that allows you to go back to the previous page using livequery click function. However, when I go back to the original page, none of the page functions defined previously are working anymore! Is there a way to force the browser to reinitialize the script? How does one get around this problem with jquery?
View 2 Replies View RelatedI've got the following bit of code:
Code:
$(function(){
$(".facebook").fancybox({
'width': '80%',
[Code]....
I can't get the iFrame to load again. In my window.load function I'm basically trying to reinitialize the fancybox iframe code and then based on the link here: [URL]
I'm trying to trigger it again. The alert appears so I know it's getting to the function but it's not opening up the iFrame.
i can't figure this out, it was working fine before, and i did a few updates and now it only works when the button is pressed but not if i type into the form and press 'enter'. i don't want he page to reload at all. (also the entire wrapper for my page is hidden using css, a loading image is displayed until the onload event fires, then the wrapper uses jQuery's .slideDown(2000), so if javascript is off they won't even see the form, i'm not concerned about browsers with javascript disabled, i *only* want them to be able to type in the field and hit enter or click the send button to post the data via ajax with no page reload. i'll make it more accessible later)
[Code]...
I have a series of divs in 2 blocks say BLOCK1 and BLOCK2 and I want to use one click to expand/collapse all those in each block. But the code I came up with exapands all the divs in the entire page.
How do I restrict it to each block and also how do I cllapse those in each block
and change the text to Collapse All. I am stumped here. Any help really really appreciated. Here is my code:
To enhance user experience on my site, I've moved a few page elements (well, the ads...) to the end of the page (in a hidden div) and when the page is loaded the content of such divs are copied to their appropriate location on the page. This makes the content load much faster and thus not delay the user.So what I did works perfectly with IE/Opera but th FireFox is causes the page to try and reload, which it never succeeds to and so we're stuck with a blank page. So yes, the problem is that there are document.write calls inside those divs which contain script but I cannot change it (google ads / ebay ads)I even tried to use setTimeout() to ensure the content is loaded (and can see that it is) but still when the move is done, the page tries to reload.
HTML side:
...
<div id="xxx_slot"></div>
[code]....
Can someone point me to method for loading random image (in container) on pageload? I have three image containers and I want to load a new image in each one at each pageload, but I want to be sure no two images are the same at the same time (if that makes sense!).
View 6 Replies View RelatedI am wanting to obtain the computed width value of an element (not window). This is of course easy enough using .width(), but the value needs to reflect the change in this element's width as a result of window resize (the element in question is being used as a page wrapper that utilizes the expand-to-fit of a block-level element).
I've read in various places that .resize() only works on window, but have managed to stumble across an article (benalman(dot)com/code/projects/jquery-resize/examples/resize/) in which .resize() works on an element other than window.
I've managed to craft together a very simple few lines based on the logic in the article. However, although the computed width of the element is returned, it requires a page reload in order for the value to be updated. What I require is the value to be update incrementally (like in article) without requiring a page reload.
Code:
function foo() {
$("#page-inner").resize(function(){
$("#header").append($(this).width());
[Code].....
I would like to get an active menu but when my page reload i loose the class.
With a button it works fine but not when the page reload with a href it only works when i add a #.
I'm using a .click event handler to add new classes to 9 list items. It does this perfectly, but once it's been clicked it reloads the page and everything resets!Here's the jQuery:
$("#diamond").click( function() {
$("#storage ul li#1").addClass("box1-diamond");
$("#storage ul li#2").addClass("box2-diamond");
[code]....
I tried using various forms of location.reload() in the onCompleteAll method, but nothing works. How can I reload my page after the file or files are done uploading? [code]
View 1 Replies View RelatedI'm reloading a div of a page using jQuery, but i need that every time that reloads (it reloads automatically every 10 seconds) obtains the get variables that i passed through the address bar
View 4 Replies View Related