I've got a fixed div that has a fixed tab as a trigger. I'd like to only show the trigger tab when the user scrolls down the page "X" pixels from the top (say like 200px). Can someone point me in the direction of implementing this?
View 4 Replies
Im using a jQuery script to show/hide a div based based on the selection made via a dropdown.
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
The problem im having is that the value used in the dropdown lists are price values eg 10.00
Consequently jQuery seems to interprit these as css notations, meaning the code doesnt work.
I have 2 fixed divs in the site I'm developing. One of them is just a tab and the other div is a contact panel. These divs alternate - if the user clicks on the tab, the tab is hidden, and the panel shows and vice versa. Everything works great. Except that when I click on the link to hide either tab or the panel, the page behind it scrolls to the top. I would like the panel to show/hide but for the page behind it to be unaffected.
// Configure Contact Us panel on page load
$('#contacton').hide();
$('#contactoff').show();
var contacting = false;
[Code].....
I have a simple jQuery code that shows or hides a DIV based on the selected value of a select tag. Currently it looks like this and it's working fine:
if (selected == "0") jQuery("#divPublishDate").show('slow')
I want to add an else so that the if the value is anything other than 0, I want to hide the div. What's the proper syntax in this case? I assume this is the short version of an IF statement without the { }.
I have a div that should be hidden on default, but when a certain URL parameter is present, then the div is visible.
[Code]...
what i have are 3 radio buttons at top of my form, the first radio option i would like if selected to open a div that contains new questions on the form... then if the other radio buttons are selected they hide that div.
View 1 Replies View RelatedI am trying to create a script that will display content based on if aradio button is selected, and if the other is selected would hide thecontent. Now, each of these radio buttons are part of a radio group,so their names are the same. Most examples show nput:radio[@name=item] Since I have 2 items that have the same name, I can't usename, so I thought I would try id or value. It isn't working. If I addonly the show, whenever you select either radio button, it shows, andif I add the hide code, it doesn't work at allHere is what I have right now.
$(document).ready(function(){
$('#offices_checkboxes').hide();
$("input:radio[@value=1]").click(function() {
[code]....
I'm trying to selectively hide and show divs based on what a user specifies using three select boxes in a form. I'm probably missing something obvious, but here's what I've got and it doesn't, work, they divs just stay hidden.
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
[Code].....
What you can see is that I have a bunch of images which form a chart, each of the images has multiple classes.I want to write a function which when called fades in/out images dependant on whether all related checkboxes are checked or not.Checkboxes are related to the images by id on the checkbox and class on the image, as I'm sure you can see. I will be calling this method each time a checkbox is checked.
View 2 Replies View RelatedSay, for example, I have a table with an undefined number of rows. Row 1 contains number 1 to 10, row 2 contains 11 to 20... you get the picture. The table is autogenerated and id's are made unique by the system (GUID's plus id). I am able to add a 'name'attribute to'img''sthat are in the td's and add a groupname i.e. '11to20'. Using this i want to test showing/hiding grouprows. Now I have a dropdownlist on the page where the user selects the groupname from
i.e."11to20". I would like to be able to hide the rows not having the selected groupname
and show the rows that do. I've constructed a query that would hide the selected groupname but it hides all tr's.
$(obj).attr('name', obj.options[obj.selectedIndex].value).parents('tr').siblings().fadeOut('fast');
Here's the (simplified) sample html I constructed by hand for this message:
<fieldset class="my-form"><div>
<div class="NumberSelector"">
<label for="ChooseNumber">Choose a number</label>
<table id="ChooseNumber" cellspacing="10" border="0" style="width:542px;">
<tr><td><label for="ChooseNumber_1">
<img name="1To10" src="/images/number1.jpg" alt="number1" onclick="ImagePopup(this);"/> .....
Using jQuery, the hide show part is easy. I need to show or hide a single section of a form based on the value of a select box. More specifically, if the select box is one of 30 countries, then show, else hide.
What's the easiest way to handle this?
I have a set of radio buttons on my pricing page:
And a corresponding text_field input element div I'd like to display based on which radio button the user selects:
When the page loads, I'd like to see:
When the user clicks on a (different) radio button, or clicks one for the first time, I'd like whichever div is currently showing to be hidden, and the newly selected one to be shown.
Right now I have jQuery code at the bottom of my page that looks like this:
For each of the four options.
When the page loads, the correct div is shown, and when I select a new button, the new div is shown, but the already showing one isn't hidden.
I've read some posts that suggest using change() instead of click(), but others indicate that's problematic in IE.
I am trying to finish a script that shows a particular div based on the last 2 chars in the cookie value. I have the cookie part done. how to show hide part.
View 7 Replies View RelatedI know from scouring the Web that this is a very common Javascript question, but I have a twist on the question which is giving me headaches, and I hope some of the brilliant minds here at DaniWeb can help show me the error of my ways.
Say a user has checked a checkbox when submitting a form. I have a PHP script that records that check in a MySQL record. Later when they visit the page, the PHP script shows the checkbox as being checked. That's all working fine.
Now here's what I'm TRYING to do: Since the checkbox is checked when the page loads, I want a certain div to show up. And when the user UNchecks the checkbox, I want the div to go away. Simple, right?
Here's the Javascript I've placed in the header:
In the CSS, I've styled a div thusly:
And here's what I'm doing in the <body>:
This should show up when you click Yellow Box. And it should go away when you click it again. </div>
When I uncheck the checkbox (first click), nothing happens: the div still shows up.
Then when I re-check the checkbox (second click), the div goes away.
And then when I un-check the checkbox again (third click), the div comes back.
In other words, it's doing the OPPOSITE of what I want.
It seems that when I click the checkbox the first time (to uncheck it), the Javascript pulls an empty value. Only with the second click is it finding a value ('none').
I have a script I am trying to use to show or hide a div id. It uses a cookie, set on link click, to remember if the div should be displayed or not.
It works, but I'm having two problems:
1) The function only shows/hides the first instance of the div, not all instances.
2) Reloading the page after an initial cookie set causes the div to always initially be displayed regardless of the last cookie value (cookie seems to automatically re-set itself to 'tutor-show').
Here is the code:
You can see it in action here: uomeds{dt}com/cbl/cbl-2.htm
I would like to show or hide a header element (e.g. <h3></h3>) based up a div tag that either contains content or not. The content is dynamically added or shown, but the header element isn't, which results in having the header element shown with no content below it many times.
Here's an example:
I'm basically looking for script that uses hide show functionality. with the addition of save state ability based on a cookie that remembers what item the user last expanded for his/her previous visit.
In other words lets say a user expands a link that has a list of information.
Then the user leaves the page and comes back to the same page. It would be ideal if that page remembers(via cookie) what the user last expanded.
Does ANYONE... know where or can perhaps paste some sample code?
I have a script to show and hide various divs based on a function & var. The problem I am having is that when ANY of the variables ('hate', 'ok' and 'love') are passed all 3 different feedback forms ('FeedbackHate', 'FeedbackOk' and 'FeedbackLove') appear, not just the one I want.
Here is the JS:
function sitesurveyswitch(emotion) {
var e = emotion;
document.getElementById('site_survey_hate').style.backgroundPosition = '0px 0px';
document.getElementById('site_survey_ok').style.backgroundPosition = '0px 0px';
document.getElementById('site_survey_love').style.backgroundPosition = '0px 0px';
document.getElementById('FeedbackHate').style.display = 'none';
document.getElementById('FeedbackOk').style.display = 'none';
document.getElementById('FeedbackLove').style.display = 'none';
if (e == 'hate')
document.getElementById('site_survey_hate').style.backgroundPosition = '-80px 0px';
document.getElementById('FeedbackHate').style.display = 'block';
if (e == 'ok')
document.getElementById('site_survey_ok').style.backgroundPosition = '-80px 0px';
document.getElementById('FeedbackOk').style.display = 'block';
if (e == 'love')
document.getElementById('site_survey_love').style.backgroundPosition = '-80px 0px';
document.getElementById('FeedbackLove').style.display = 'block';
}
And here is the code related to this function:
<div id="siteSurveyBox">
<span id="site_survey_hate" onclick="sitesurveyswitch('hate');return false;"></span>
<span id="site_survey_ok" onclick="sitesurveyswitch('ok');return false;"></span>
<span id="site_survey_love" onclick="sitesurveyswitch('love');return false;"></span>
</div>
<div id="FeedbackHate" style="display:none; margin-top:-28px;">
FEEDBACK FORM IS HERE
</div>
<div id="FeedbackOk" style="display:none; margin-top:-28px;">
FEEDBACK FORM IS HERE
</div>
<div id="FeedbackLove" style="display:none; margin-top:-28px;">
FEEDBACK FORM IS HERE
</div>
I have a select box where the value must be passed via the form. If the users selects choice B or Choice C then I want a specific div to show. If they choose choice A then I want the div to hide or remain hidden. It should be hidden on page load.
Code:
Ok so I have a select box where the value must be passed via the form. If the users selects choice B or Choice C then I want a specific div to show. If they choose choice A then I want the div to hide or remain hidden. It should be hidden on page load.
<select name="Event_Type_ID">
<option value="1">Choice A</option>
<option value="2">Choice B</option>
[code]....
I have a form with three radio options. And I have three buttons:
<input type="submit" name="mainform_action" value="Edit Data">
<input type="submit" name="mainform_action" value="View Data">
<input type="submit" name="mainform_action" value="Delete Data">
If the first radio button is selected, I only want all three buttons to be
visible to the user.
If the second radio button is selected, I only want the "Edit Data" and "View
Data" buttons to be visible.
If the third radio button is selected, I only want the "View Data" button to be
visible.
Is it possible to accomplish this in Javascript? In particular, I want to
continue using the "input type=submit" buttons without having to create my own.
how can I show / hide the content of sub divs based on whether the input is != or = and be able to repeat this.I tried to hide the sub divs using , onclick if bla bla = '' ;document.getElementById('hideme').innerHTML = ''; which works, but once I try to enter a new input, then nothing happens, even if the content of the sub divs is = input.
View 2 Replies View RelatedThe two page sections you see on the page "One Time Gift" or "Monthly Subscription" are normally hidden via a document.write via a body onload. Generally, all of this functions well. But, I want to expand the use a bit here so I want to pass a $_POST value to this page from another page which hides or shows these two sections based on this passed value. So, if the value in "once", I want the div with the id="onetime" to be visible and the other div to be hidden. If the value is "monthly", then the opposite would happen. Now this is supposed to all happen as the page loads because we are just arrivng here from the sending page.
View 9 Replies View RelatedI have 3 divs that contain radio with labels and beneath each radio button I would like to show/hide a form based on whether the radio is selected or not.
Code idea:
So if the radio1 input is selected this would show form1. Selecting radio2 input would hide any other forms (form1, form3) and show form 2 etc.
I've tried to find a stright forward script which show/hide specific form fields based on a selected option. I've seen many online but non of them was working with me without the need of some coding or tweeks. Does anyone here have such script?
View 4 Replies View Relatedi would like to have 2 radio buttons each with a associated div when the page loads the first radio button will be checked and its corresponding div will be show when the user checks the other radio button its corresponding div is shown and the first div is hidden:
View 2 Replies View Related
