toggle table rows


I am trying to toggle rows in a table based on the selection of a radio button. The functions is as follows: function showHideRows(clsName, hideshow) { var table = document.getElementById('fullTable'); var rows = table.getElementsByTagName('tr'); for(var i=0;i
Posted On: Saturday 24th of November 2012 03:54:42 AM Total Views:  132
View Complete with Replies

RELATED TOPICS OF JavaScript PROGRAMMING LANGUAGE




toggle form variable id

I have a tabbed content area which toggles using bootstrap. This works fine, but I also have a form which uses a variable... var id_form = 35; What I would like to do is change this variable number depending on what content is active. So, if a certain css class exsists the number with change accordingly. Is this even possible\t Here is some code to help demonstrate what I mean: HTML Code: Double Glazing Triple Glazing uPVC Doors Bifold Doors Secondary Glazing Double Glazing Reduce your annual heating bills by up to £300 a year and keep your home warmer in the winter with double glazed windows. Double glazing retains heat, ensuring you don't have to turn up the boiler's temperature to keep warm. On top of this, cut your home's carbon emissions by as much as 680kg a year too. Triple Glazing Save even more money on your energy bills with triple glazing, whilst improving security and cutting home carbon emissions. Triple glazing prevents heat from escaping your home, making sure you dont have to up the boiler's temperature to keep warm. Make your home more efficient and cut bills throughout the year. uPVC Doors uPVC has become the most popular external door material for a number of reasons, including energy efficiency and security. 20-25% of heat is lost through doors and windows so insulate your home and cut energy bills with a sturdy uPVC door. You'll even improve security with the latest locking mechanisms, giving you greater peace of mind. Bifold Doors Create an elegant feel and make the most of your home's space with bifolding doors. Door panels are connected by centralised hinges, allowing you to fold the unit together and push to one side. This ease of operation makes them perfect for conservatories and the variety of styles means there's something suitable for every home. Secondary Glazing Benefit from reduced energy bills even if you live in a Conservation Area or listed building. Secondary glazing acts as an extra barrier to retain heat in the property, improving your home security and cutting noise pollution. A second pane is fitted on the inside of the original unit and this can help you slash bills by hundreds of pounds annually. var id_site = 362; var id_form = 35; var width = 535; var bgcolor = 'transparent'; var font_size = '11px'; var font_family_global = 'Verdana,Arial'; var font_family_title = 'Verdana,Arial'; var font_family_input = 'Verdana,Arial'; var font_color_global = '#333'; var font_color_title = '#343434'; var font_color_input = '#3A3A3A'; var font_color_radiocheck = '#666'; var bgcolor_rollover = '#cce9f9'; var intro = 0; var no_infobox = 0; var scenario_no_header = 0; var onestep = 1; var no_footer = 0; var bgcolor_rollover = '#cce9f9'; var intro = 0; var no_infobox = 1; var scenario_no_header = 1; var onestep = 0; var no_footer = 1; var scenario_no_header=1 var no_progressbar=1 var font_color_title = 'transparent; background:none'; var scenario_color_title ='transparent'; var bgcolor = 'transparent';
VIEWS ON THIS POST

55

Posted on:

Monday 1st October 2012
View Replies!

Click a checkbox to 'toggle' between HREF values for a link.

here is what I am trying to do, mind if I sound simple this is my first major javascript attempt. You click the checkbox and it changes a link. You click the checkbox again and it changes it back. So you have a page with a link : and a checkbox : Clicking the checkbox runs the javascript function ChangeTarget(). Here is what I want the javascript to do: Code: 1. Write current pay value to variable 2. Compare variable to paypal link -3. change to clickbank link -else change to paypal link. Here is the code I have tried that doesnt work: Code: var link = document.getElementById('pay'); function changeTarget() if(link == "https://www.paypal.com/cgi-bin/webscrcmd=_s-xclick&hosted_button_id=5RSNVHTY5D6RN") document.getElementById('pay').href="http://1.60years.pay.clickbank.net"; else document.getElementById('pay').href="https://www.paypal.com/cgi-bin/webscrcmd=_s-xclick&hosted_button_id=5RSNVHTY5D6RN"; Any help would be very much appreciated, I don't know why it isnt working. It just doesnt do anything when you click it. I know the following DOES work, but it only changes the link to the value chosen... no way of changing it back when you click the checkbox a second time. Code: //WORKING CODE function changeTarget() { document.getElementById('pay').href="http://1.60years.pay.clickbank.net"; }
VIEWS ON THIS POST

85

Posted on:

Wednesday 17th October 2012
View Replies!

toggle container doesn't align where I want it to

I have a container that has items in it and in order to expand them you hit the + sign to smoothly expand the content under that header. My problem is that I want the header and the + to be on the same line and to not be appended to the items when they are expanded. Right now the read more button(expand button) ends up at the bottom when it is clicked because of the list items expanding. Here is my js for that section, and the css for the read more button. Code: // auto-add-in 'read more' hooks after 4 bullet points $("#att_container ul").each(function() { var elem = $(this); // break up list into separate lists, more than 4 is toggle_container if ( elem.children("li").length > 0 ) { elem.after(''); // add hidden container after current element var hiddenContainer = elem.next(".toggle_container"); // save a reference to it elem.children("li").slice(0).appendTo(hiddenContainer); // move the children past the limit hiddenContainer.after(' '); // read more button } }); //Hide (Collapse) the toggle containers on load $(".toggle_container").hide(); //Switch the "Open" and "Close" state per click $("p.trigger").toggle(function(){ $(this).addClass("active"); }, function () { $(this).removeClass("active"); }); //Slide up and down on click $("p.trigger").click(function(){ $(this).prev(".toggle_container").slideToggle("slow"); }); // Expand and Collapse $(".expand").click(function(){ $("p.trigger").addClass("active").prev(".toggle_container").slideDown("slow"); }); $(".collapse").click(function(){ $("p.trigger").removeClass("active").prev(".toggle_container").slideUp("slow"); }); }); Here is the css for the read more button Code: #att_container p.trigger a { display:block; float:right; width: 76px; height: 19px; margin: 0; padding: 0; background: url(../images/readmore_att.jpg) top left no-repeat; } #att_container p.active a { background: url(../images/readmore_att.jpg) bottom left no-repeat; }
VIEWS ON THIS POST

75

Posted on:

Wednesday 17th October 2012
View Replies!

Js file disables toggle from all effects

this js file disables the toggle from all my effects. any idea how to fix this problem without deleting this Code: // SpryDOMEffects.js - version 0.6 - Spry Pre-Release 1.7 // // Copyright (c) 2007. Adobe Systems Incorporated. // rights reserved. // // Redistribution and use in source and binary forms, with or without // modification, are permitted provided that the following conditions are met: // // * Redistributions of source code must retain the above copyright notice, // this list of conditions and the following disclaimer. // * Redistributions in binary form must reproduce the above copyright notice, // this list of conditions and the following disclaimer in the documentation // and/or other materials provided with the distribution. // * Neither the name of Adobe Systems Incorporated nor the names of its // contributors may be used to endorse or promote products derived from this // software without specific prior written permission. // // THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" // AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE // IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE // ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE // LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR // CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF // SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS // INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN // CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) // ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE // POSSIBILITY OF SUCH DAMAGE. (function() { // BeginSpryComponent if (typeof Spry == "undefined" || !Spry.Utils || !Spry.$$) { alert("SpryDOMEffects.js requires SpryDOMUtils.js"); return; } if (!Spry.Effect) Spry.Effect = {}; Spry.Effect.Animator = function(opts) { Spry.Effect.Animator.Notifier.call(this); this.animatorID = Spry.Effect.Animator.nextID++; this.dropFrames = true; this.fps = 60; // frames per-second this.duration = 500; // msecs this.timer = 0; this.startTime = 0; // Used only when dropFrames is true. this.currentFrame = 0; this.easeFunc = Spry.Effect.Animator.defaultEaseFunc; this.stopped = false; Spry.Effect.Animator.copyProps(this, opts); this.interval = 1000 / this.fps; this.numFrames = (this.duration / 1000) * this.fps; if (this.onComplete) { var self = this; this.addObserver({ onAnimationComplete: function(){ self.onComplete(); } }); } }; Spry.Effect.Animator.nextID = 1; Spry.Effect.Animator.copyProps = function(dst, src) { if (src) { for (prop in src) dst[prop] = src[prop]; } return dst; }; Spry.Effect.Animator.getElement = function(element) { if (arguments.length > 1) { for (var i = 0, elements = [], length = arguments.length; i < length; i++) elements.push(Spry.Effect.Animator.getElement(arguments[i])); return elements; } if (typeof element == 'string') element = document.getElementById(element); return element; }; Spry.Effect.Animator.defaultEaseFunc = function(time, begin, finish, duration) { time /= duration; return begin + ((2 - time) * time * finish); }; Spry.Effect.Animator.Notifier = function() { this.observers = []; this.suppressNotifications = 0; }; Spry.Effect.Animator.Notifier.prototype.addObserver = function(observer) { if (!observer) return; // Make sure the observer isn't already on the list. var len = this.observers.length; for (var i = 0; i < len; i++) { if (this.observers[i] == observer) return; } this.observers[len] = observer; }; Spry.Effect.Animator.Notifier.prototype.removeObserver = function(observer) { if (!observer) return; for (var i = 0; i < this.observers.length; i++) { if (this.observers[i] == observer) { this.observers.splice(i, 1); break; } } }; Spry.Effect.Animator.Notifier.prototype.notifyObservers = function(methodName, data) { if (!methodName) return; if (!this.suppressNotifications) { var len = this.observers.length; for (var i = 0; i < len; i++) { var obs = this.observers[i]; if (obs) { if (typeof obs == "function") obs(methodName, this, data); else if (obs[methodName]) obs[methodName](this, data); } } } }; Spry.Effect.Animator.Notifier.prototype.enableNotifications = function() { if (--this.suppressNotifications < 0) { this.suppressNotifications = 0; Spry.Debug.reportError("Unbalanced enableNotifications() call!\n"); } }; Spry.Effect.Animator.Notifier.prototype.disableNotifications = function() { ++this.suppressNotifications; }; Spry.Effect.Animator.prototype = new Spry.Effect.Animator.Notifier; Spry.Effect.Animator.prototype.constructor = Spry.Effect.Animator; Spry.Effect.Animator.prototype.start = function() { this.stopped = false; this.currentFrame = 0; this.startTime = (new Date()).getTime(); this.notifyObservers("onAnimationStart"); var self = this; this.timer = setTimeout(function(){ self.onStepAnimation(); }, this.interval); }; Spry.Effect.Animator.prototype.stop = function() { if (this.timer) clearTimeout(this.timer); this.timer = 0; this.stopped = true; this.notifyObservers("onAnimationStopped"); }; Spry.Effect.Animator.prototype.onStepAnimation = function() { var obj = {}; if (this.dropFrames) { obj.duration = this.duration; obj.elapsed = ((new Date).getTime()) - this.startTime; if (obj.elapsed > obj.duration) obj.elapsed = obj.duration; } else { obj.duration = this.numFrames; obj.elapsed = ++this.currentFrame; } obj.easingConst = this.easeFunc(obj.elapsed, 0, 1, obj.duration) this.notifyObservers("onPreDraw", obj); this.draw(obj.elapsed, obj.duration, obj.easingConst); this.notifyObservers("onPostDraw", obj); if (!this.stopped) { if (obj.elapsed < obj.duration) { var self = this; this.timer = setTimeout(function(){ self.onStepAnimation(); }, this.interval); } else { this.stop(); this.notifyObservers("onAnimationComplete"); } } }; Spry.Effect.Animator.prototype.draw = function(elapsed, duration, easingConst) { // The default draw method does nothing. It is assumed that // derived classes will provide their own implementation of this // method. debug.log("elapsed: " + elapsed + " -- duration: " + duration + " -- easingConst: " + easingConst); }; /////////////////////////////////////////////////////////////////////////////// Spry.Effect.CSSAnimator = function(elements, styleStr, opts) { this.animationSets = []; Spry.Effect.Animator.call(this, opts); this.add(elements, styleStr); }; Spry.Effect.CSSAnimator.prototype = new Spry.Effect.Animator(); Spry.Effect.CSSAnimator.prototype.constructor = Spry.Effect.CSSAnimator; Spry.Effect.CSSAnimator.prototype.add = function(elements, styleStr) { // The first argument for the CSSAnimator can be // the id of an element, an element node, or an array of // elements and/or ids. elements = Spry.$$(elements); if (elements.length < 1) return; var animSet = { elements: elements, cssProps: []}; this.animationSets.push(animSet); // Convert the styleStr into an object. var toObj = Spry.Utils.styleStringToObject(styleStr); for (var p in toObj) { var obj = new Object; var v = toObj[p]; obj.value = new Number(v.replace(/[^-\d\.]+/g, "")); obj.units = v.replace(/[-\d+\.]/g, ""); toObj[p] = obj; } for (var i = 0; i < elements.length; i++) { var obj = animSet.cssProps[i] = new Object; for (var p in toObj) { var pFuncs = Spry.Effect.CSSAnimator.stylePropFuncs[p]; if (!pFuncs) pFuncs = Spry.Effect.CSSAnimator.stylePropFuncs["default"]; obj[p] = new Object; obj[p].from = new Number(pFuncs.get(elements[i], p).replace(/[^-\d\.]+/g, "")); obj[p].to = toObj[p].value; obj[p].distance = obj[p].to - obj[p].from; obj[p].units = toObj[p].units; } } }; Spry.Effect.CSSAnimator.prototype.start = function() { for (var s = 0; s < this.animationSets.length; s++) { var animSet = this.animationSets[s]; var elements = animSet.elements; var cssProps = animSet.cssProps; for (var i = 0; i < elements.length; i++) { var ele = elements[i]; var eleProps = ele.spryCSSAnimatorProps; if (!eleProps) eleProps = ele.spryCSSAnimatorProps = new Object; var obj = cssProps[i]; for (var p in obj) eleProps[p] = this.animatorID; } } return Spry.Effect.Animator.prototype.start.call(this); }; Spry.Effect.CSSAnimator.prototype.stop = function() { for (var s = 0; s < this.animationSets.length; s++) { var animSet = this.animationSets[s]; var elements = animSet.elements; var cssProps = animSet.cssProps; for (var i = 0; i < elements.length; i++) { var ele = elements[i]; var obj = cssProps[i]; var eleProps = ele.spryCSSAnimatorProps; for (var p in obj) { if (eleProps[p] == this.animatorID) delete eleProps[p]; } } } return Spry.Effect.Animator.prototype.stop.call(this); }; Spry.Effect.CSSAnimator.prototype.draw = function(elapsed, duration, easingConst) { for (var s = 0; s < this.animationSets.length; s++) { var animSet = this.animationSets[s]; var elements = animSet.elements; var cssProps = animSet.cssProps; for (var i = 0; i < elements.length; i++) { var ele = elements[i]; var eleProps = ele.spryCSSAnimatorProps; var obj = cssProps[i]; for (var p in obj) { if (eleProps[p] == this.animatorID) { var pFuncs = Spry.Effect.CSSAnimator.stylePropFuncs[p]; if (!pFuncs) pFuncs = Spry.Effect.CSSAnimator.stylePropFuncs["default"]; if (elapsed > duration) pFuncs.set(ele, p, obj[p].to + obj[p].units); else pFuncs.set(ele, p, obj[p].from + (obj[p].distance * easingConst) + obj[p].units); } } } } }; Spry.Effect.CSSAnimator.stylePropFuncs = {}; Spry.Effect.CSSAnimator.stylePropFuncs["default"] = { get: function(ele, prop) { return ele.style[prop]; }, set: function(ele, prop, val) { ele.style[prop] = val; } }; Spry.Effect.CSSAnimator.stylePropFuncs["opacity"] = { get: function(ele, prop) { var val = 1; if (ele.style.opacity) val = ele.style.opacity; else if (ele.style.filter) { var strVal = ele.style.filter.replace(/.*alpha\(opacity=(\d+)\).*/, "$1"); if (strVal) val = parseInt(strVal) / 100; } return val + ""; }, set: function(ele, prop, val) { ele.style.opacity = "" + val; ele.style.filter = "alpha(opacity=" + (val * 100) + ")"; } }; /////////////////////////////////////////////////////////////////////////////// Spry.$$.Results.defaultEaseFunc = function(time, begin, finish, duration) { time /= duration; return begin + ((2 - time) * time * finish); }; Spry.$$.Results.animatePropertyTo = function(propName, to, options) { var opts = { interval: 10, duration: 1000, onComplete: null, transition: Spry.$$.Results.defaultEaseFunc }; Spry.Effect.Animator.copyProps(opts, options); var objs = []; for (var i = 0; i < this.length; i++) { var obj = objs[i] = new Object; obj.ele = this[i]; obj.from = obj.ele[propName]; obj.distance = to - obj.from; } var startTime = (new Date).getTime(); var animateFunc = function() { var elapsedTime = ((new Date).getTime()) - startTime; if (elapsedTime > opts.duration) { for (var i = 0; i < objs.length; i++) objs[i].ele[propName] = to; if (opts.onComplete) opts.onComplete(); } else { for (var i = 0; i < objs.length; i++) { var obj = objs[i]; obj.ele[propName] = opts.transition(elapsedTime, obj.from, obj.distance, opts.duration); } setTimeout(animateFunc, opts.interval); } }; setTimeout(animateFunc, opts.interval); return this; }; Spry.$$.Results.animateStyleTo = function(styleStr, options) { var a = new Spry.Effect.CSSAnimator(this, styleStr, options); a.start(); return this; }; })(); // EndSpryComponent
VIEWS ON THIS POST

70

Posted on:

Wednesday 17th October 2012
View Replies!

HOW TO: jquery form - if option is selected slidetoggle div?

Greetings, I am trying to make a form that collects "Number of Children" a parent has. If they select "4" from the select input, then I want to slidetoggle out the appropriate divs, one for each child. Code: 0 1 2 3 4 5 The div IDs to display are 1child, 2child, 3child, 4child, 5child. I have been able to use slidetoggle in the past when attached to a button, but this one has me lost. Anyone know how to accomplish this Your help is greatly appreciated! Thank you!
VIEWS ON THIS POST

206

Posted on:

Wednesday 17th October 2012
View Replies!

Resolved Change link text and toggle checkboxes on/off

I have a textual "link" that, when clicked, I want the text to change, and I want a number of checkboxes to be toggled on or off. Here's my code. Currently, I just have the text changing - I don't know how to simultaneously check/uncheck checkboxes. Code: function check(checkname, exby) { for (i = 0; i < checkname.length; i++) checkname[i].checked = exby.checked true:false } function exp(obj) { if(obj.oldText) { obj.innerHTML = obj.oldText; obj.oldText = null; } else { obj.oldText = obj.innerHTML; obj.innerHTML = 'Check '; } } Clear Check1 Check2 Check3
VIEWS ON THIS POST

94

Posted on:

Saturday 20th October 2012
View Replies!

toggle and untoggle

Hi all, looking for some help. I found this script that does almost everything i need. I have a form that has a small section of two radio buttons when you click on the first one i need a series of text boxes to open wrapped in a div box and that happens great, but when the other one is clicked i need them to go away, the whole div box. also the text boxes also have some hidden fields attached to them will not not pass to the shopping cart if the text boxes are disabled. here is what i have so far. placed in head Code: function toggle(chkbox, group) { var visSetting = (chkbox.checked) "visible" : "hidden" document.getElementById(group).style.visibility = visSetting } part of the form having issues with Code: Send directly to recipant: Send to me to give to the recipant: First Name Last Name Address   City State Zip code please anyone with help will be great
VIEWS ON THIS POST

62

Posted on:

Saturday 20th October 2012
View Replies!

trying to toggle a css, using greasemonkey

ok i had a scriptwhere it changed the style of youtube to a red and black version, and it worked fine (i threw it together from some various things on the web and made a css style to work, and it works really well however i want to add a toggle style to it. i have tried this below (function() { var type = 1; var css = //css code var css1 = //more css code var type1 = type+1; var change = "Toggle Style"; var changeLocation = document.getElementById('masthead-nav-user').innerHTML; document.getElementById('masthead-nav-user').innerHTML = change+changeLocation; changeStyle(type); function changeStyle(type){ if (typeof GM_addStyle != "undefined") { if(type == 0){ }else if(type == 1){ GM_addStyle(css); }else if(type == 2){ GM_addStyle(css1); } } else if (typeof addStyle != "undefined") { if(type == 0){ }else if(type == 1){ addStyle(css); }else if(type == 2){ addStyle(css1); } } else { if(type == 0){ }else if(type == 1){ var heads = document.getElementsByTagName("head"); if (heads.length > 0) { var node = document.createElement("style"); node.type = "text/css"; node.appendChild(document.createTextNode(css)); heads[0].appendChild(node); } }else if(type == 2){ var heads = document.getElementsByTagName("head"); if (heads.length > 0) { var node = document.createElement("style"); node.type = "text/css"; node.appendChild(document.createTextNode(css1)); heads[0].appendChild(node); } } } } } )(); now it loads up using the css code however when i click the toggle style link i added nothing happens, ive gone into firebug and the right value is being passed through its just not changing the style. i dont want to sound desperate but 'heelllppp' ive been at this for ages
VIEWS ON THIS POST

112

Posted on:

Saturday 10th November 2012
View Replies!

javascript toggle div keep as it is after page refresh?

I have one menu toggle div manu which is slide up and down. For that I used jquery.Cookie plugin but still it's not working. here is my problem : http://jsfiddle.net/wasimkazi/fauNg/10/ please help me... $(document).ready(function() { $(".widget2").hide(); var $widget2 = $(".widget2"); readCookie('widget2') === 'open' $widget2.show() : $widget2.hide(); $(".box2").toggle(function() { $(this).next(".widget2").slideDown(200); setCookie('widget2', 'open', 1); }, function() { $(this).next(".widget2").slideUp(200); setCookie('widget2', 'close', 1); }); var $inner = $(".inner"); readCookie('inner') === 'open' $inner.show() : $inner.hide(); $(".box").toggle(function() { $(this).next(".inner").slideDown(200); setCookie('inner', 'open', 1); }, function() { $(this).next(".inner").slideUp(200); setCookie('inner', 'close', 1); }); }); function setCookie(name, value, days) { if (days var date = new Date(); date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); var expires = "; expires=" + date.toGMTString(); } else var expires = ""; document.cookie = name + "=" + value + expires + "; path=/"; } function readCookie(name) { var nameEQ = name + "="; var ca = document.cookie.split(';'); for (var i = 0; i < ca.length; i++) { var c = ca[i]; while (c.charAt(0) == ' ') c = c.substring(1, c.length); if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length); } return null; } Tennis Australia Australian Open M. Basketball Australia Australian NBL
VIEWS ON THIS POST

80

Posted on:

Saturday 10th November 2012
View Replies!

Set Cookies after toggle from background image to?

, I have a problem with setting a cookie. People can hide or show background but when they go to another page of the website this needs to be remembered so I need to save it in a cookie. My code so far is Menu toggle background // //name = "mycookiename" or whatever name you wish to give the cookie //value = "anything" - in this case the url of the image //days = number of days cookie to remain active (say 365) //Using the following functions are from quirksmode. - START function createCookie(name, value, days) { if (days) { var date = new Date(); date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); var expires = "; expires=" + date.toGMTString(); } else var expires = ""; document.cookie = name + "=" + value + expires + "; path=/"; } function readCookie(name) { var nameEQ = name + "="; var ca = document.cookie.split(';'); for (var i = 0; i < ca.length; i++) { var c = ca[i]; while (c.charAt(0) == ' ') c = c.substring(1, c.length); if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length); } return null; } function eraseCookie(name) { createCookie(name, "", -1); } function toggle() { eraseCookie('background'); var element = document.getElementById("back"); var text = document.getElementById("displayText"); if(element.style.display == "none") { element.style.display = "block"; text.innerHTML = "Hide Background"; createCookie( "background", "id", 365); } else { element.style.display = "none"; text.innerHTML = "Show Background"; createCookie( "background", "id", 365); } } Hide Background I hope somebody can help me find a solution for my problem. (with javascript or php)
VIEWS ON THIS POST

70

Posted on:

Saturday 10th November 2012
View Replies!

Get toggle state var id pass to PHP

I'm using mootools-core-1.3.2.js to hide/show a div tag. Now what I want to do is : * slide the div tag away (done and works); * get the value from the "horizontal_status" and put in in PHP var to toggle something else Here's the javascript code: window.addEvent('domready', function() { var status = { 'true': 'open', 'false': 'close' }; // -- horizontal var myHorizontalSlide = new Fx.Slide('site_layout_sidebar', {mode: 'horizontal'}); $('h_slidein').addEvent('click', function(event){ event.stop(); myHorizontalSlide.slideIn(); }); $('h_slideout').addEvent('click', function(event){ event.stop(); myHorizontalSlide.slideOut(); }); $('h_toggle').addEvent('click', function(event){ event.stop(); myHorizontalSlide.toggle(); }); $('h_hide').addEvent('click', function(event){ event.stop(); myHorizontalSlide.hide(); $('horizontal_status').set('text', status[myHorizontalSlide.open]); }); $('h_show').addEvent('click', function(event){ event.stop(); myHorizontalSlide.show(); $('horizontal_status').set('text', status[myHorizontalSlide.open]); }); // When Horizontal Slide ends its transition, we check for its status // note that complete will not affect 'hide' and 'show' methods myHorizontalSlide.addEvent('complete', function() { $('horizontal_status').set('text', status[myHorizontalSlide.open]); }); }); How do I get the $('horizontal_status') into a PHP var so that I can do something with that
VIEWS ON THIS POST

86

Posted on:

Saturday 10th November 2012
View Replies!

Jquery toggle() problem

So what I need is there anyway to animate my picture that shows as background without animating overlaying div's I want most of the content to stay the same while it loads a new background.
VIEWS ON THIS POST

80

Posted on:

Monday 12th November 2012
View Replies!

toggle checkbox group when the max limit is reached

hi Suppose i have 10 checkboxes and i allow the user to check max of 4 checkboxes. When the limit is reached i.e. 4, i need to disable all the other checkboxes and when i uncheck anyone (now only 3 are checked) all the checkboxes should be enabled Here's the code which i tried function checkboxlimit(checkgroup,max,min){ var checkgroup=checkgroup var limit=limit for (var i=0; i
VIEWS ON THIS POST

110

Posted on:

Friday 16th November 2012
View Replies!

Setting cookie for toggle function

I would really appreciate some help with this. I have searched and searched the internet but cannot find information on exactly what I am trying to do. I have a javascript toggle function: function toggle_change() { var ele = document.getElementById("change_log"); var text = document.getElementById("Toggle_change"); if(ele.style.display == "none") { ele.style.display = "block"; text.innerHTML = "-"; } else { ele.style.display = "none"; text.innerHTML = "+"; } } What I am trying to do is set a cookie that will remember if the display status is "none". This is probably something simple but I don't know much about javascript obviously. I've tried a few different approaches but I can never get the script to actually set a cookie.
VIEWS ON THIS POST

80

Posted on:

Friday 16th November 2012
View Replies!

Changing toggle states depending on URL Hash

, I am trying to customize a Woothemes shortcode toggle in their 'Canvas' theme, and in my particular case I have two toggles on my Wordpress page. One toggle shows by default, the other is hidden. What I want to do is switch those toggle states around (open the second toggle, close the first toggle) if a certain URL hash is entered. Example: Toggle 1 state = open Toggle 2 state = closed User enters http://example.com/#opentoggle2 Toggle 1 state = closed Toggle 2 state = open I am guessing I would have to assign the two toggles different ID's somehow to make this happen and then run location.hash or something similar. I am using WooThemes shortcode system, so the toggle is comprised of the following code in two files shortcode.js and shortcode.css: shortcode.js jQuery(function($) { /*----------------------------------------------------------------------------------- Toggle shortcode -----------------------------------------------------------------------------------*/ if ( jQuery( '.shortcode-toggle').length ) { jQuery( '.shortcode-toggle').each( function () { var toggleObj = jQuery(this); toggleObj.closedText = toggleObj.find( 'input[name="title_closed"]').attr( 'value' ); toggleObj.openText = toggleObj.find( 'input[name="title_open"]').attr( 'value' ); // Add logic for the optional excerpt text. if ( toggleObj.find( 'a.more-link.read-more' ).length ) { toggleObj.readMoreText = toggleObj.find( 'a.more-link.read-more' ).text(); toggleObj.readLessText = toggleObj.find( 'a.more-link.read-more' ).attr('readless'); toggleObj.find( 'a.more-link.read-more' ).removeAttr('readless'); toggleObj.find( 'a.more-link' ).click( function () { var moreTextObj = jQuery( this ).next( '.more-text' ); moreTextObj.animate({ opacity: 'toggle', height: 'toggle' }, 300).css( 'display', 'block' ); moreTextObj.toggleClass( 'open' ).toggleClass( 'closed' ); if ( moreTextObj.hasClass( 'open') ) { jQuery(this).text(toggleObj.readLessText); } // End IF Statement if ( moreTextObj.hasClass( 'closed') ) { jQuery(this).text(toggleObj.readMoreText); } // End IF Statement return false; }); } toggleObj.find( 'input[name="title_closed"]').remove(); toggleObj.find( 'input[name="title_open"]').remove(); toggleObj.find( 'h4.toggle-trigger a').click( function () { toggleObj.find( '.toggle-content').animate({ opacity: 'toggle', height: 'toggle' }, 300); toggleObj.toggleClass( 'open' ).toggleClass( 'closed' ); if ( toggleObj.hasClass( 'open') ) { jQuery(this).text(toggleObj.openText); } // End IF Statement if ( toggleObj.hasClass( 'closed') ) { jQuery(this).text(toggleObj.closedText); } // End IF Statement return false; }); }); } // End IF Statement }); // jQuery() shortcode.css /*-------------------------------------------------------------------------------------------*/ /* 15. Content Toggle */ /*-------------------------------------------------------------------------------------------*/ .shortcode-toggle { margin: 0 0 1.2em;} .shortcode-toggle h4 {margin: 0;} .shortcode-toggle h4 a { display: block; padding: 3px 0 3px 10px; background: #f3f3f3 url(../images/shortcode-toggle-close.png) no-repeat 99% center; } .shortcode-toggle.closed h4 a { background-image: url(../images/shortcode-toggle-open.png); } .shortcode-toggle .toggle-content { padding: 10px 10px; background: #f9f9f9; } .shortcode-toggle.closed .toggle-content, .shortcode-toggle .more-text.closed { display: none; } .shortcode-toggle .more-text.open { display: block; } .shortcode-toggle.border { border: 1px solid #EBEBEB; } /*-------------------------------------------------------------------------------------------*/ /* -15.1 Content Toggle Alternate Style - White */ /*-------------------------------------------------------------------------------------------*/ .shortcode-toggle.white h4 a { background-color: #FFFFFF; } .shortcode-toggle.white .toggle-content { background-color: #FFFFFF; } I've started to write the code below to see if I could get both to open from their closed states with no luck.. var hash = window.location.hash; if (hash = $("#participant")) { toggleObj.openText = toggleObj.find( 'input[name="title_open"]').attr( 'value' ); } // End IF Statement How would I work this into the shortcode.js file I am a JS newbie. Hopefully someone here could help me make this happen,
VIEWS ON THIS POST

80

Posted on:

Monday 19th November 2012
View Replies!

One function to toggle multiple divs

I will have a page with about a 100 or so different links and I would like each one to toggle the visibility of its corresponding hidden div. For instance, if I have a county 'Johnson' when it's clicked I would like the hidden div associated with that county to become visible. I would like to do this without having to write a different function for each one. Is there a way to do this easily Below is a solution I was given elsewhere but I couldn't get it to work. Most ideal of all I would like it to work with an image map, with each county having it's own set of stats to be toggled in.
VIEWS ON THIS POST

126

Posted on:

Monday 19th November 2012
View Replies!

jQuery toggle script not working

This script has worked on another site and I can't figure out why it isn't working on this one. $(document).ready(function(){ //Hide (Collapse) the toggle containers on load $(".toggle_container").hide(); //Switch the "Open" and "Close" state per click then slide up/down (depending on open/close state) $("h2.trigger").click(function(){ $(this).toggleClass("active").next().slideToggle("slow"); return false; //Prevent the browser jump to the link anchor }); }); It will open the first trigger selected, but will not close it or open any subsequent triggers. The problem page is http://www.audacitym...99/Default.aspx
VIEWS ON THIS POST

81

Posted on:

Wednesday 21st November 2012
View Replies!

Changing toggle image problem..

ToggleTip = function() { var el = $('Tip'); if ( el.style.display != 'none' ) { el.style.display = 'none'; $('ToggleImg').src = 'Images/mo1.gif'; } else { el.style.display = 'block'; $('ToggleImg').src = 'Images/mo2.gif'; } } That code is fine! But, it work work unless it's like so, or, the only way I can get it to work. Admin.ToggleTip = function() { var el = $('Tip'); if ( el.style.display != 'none' ) { el.style.display = 'none'; $('ToggleImg').src = 'Images/mo1.gif'; } else { el.style.display = 'block'; $('ToggleImg').src = 'Images/mo2.gif'; } alert($('Tip').src); } Then it works.. And I can't understand why! I've tried making the script do other functions after insted of alert. Admin.ToggleTip = function() { var el = $('Tip'); if ( el.style.display != 'none' ) { el.style.display = 'none'; $('ToggleImg').src = 'Images/mo1.gif'; } else { el.style.display = 'block'; $('ToggleImg').src = 'Images/mo2.gif'; } for (var i = 0; i < document.images.length; i++) { //Will this work! } } But still doesn't work
VIEWS ON THIS POST

95

Posted on:

Wednesday 21st November 2012
View Replies!

chaning layout with toggle button

I'm trying to make a page where you can change a page's layout through 2 separate CSS's via a button. i want to button to change text when it toggles the layouts as well. i have no clue how to do this with an entire CSS file, but here is something i made to change the background. could i use this logic to change the CSS of a page HTML
VIEWS ON THIS POST

93

Posted on:

Thursday 22nd November 2012
View Replies!

toggle node with checkbox

, I currently have a hyperlink to toggle the node, showing and hiding the list. Could someone show me how to use a checkbox instead of the hyperlink to do the same thing
VIEWS ON THIS POST

140

Posted on:

Thursday 22nd November 2012
View Replies!