JavaScript - Why Does One Url Direct Work And The Other Not?

Ok, I paid to have a website built, yet the developer used iFrames to accomplish the task. Basically, load a parent page, and then in an iframe, lod content chosen from a menu.
Is there a way to create a menu at the homepage level, that will allow a menu listing the various parent pages, and under each parent page, have a drop down that will point directly at an iframe content?

Like this?

Page1 Page2 Page3
Page1ContentA
Page1ContentB
Page1ContentC

And when you click Page1ContentC, it will load Page1.htm and in the iframe load Page1ContentC?

If i am not clear, please let me know. Any help appreciated.

Jeff

Hi All,

I have to know whether we can track the direct browser closing event by Javascript.
I have tried with window.unload & window.onbeforeunload, but I was not get full satisfaction with those ones.
Please let me know if anybody have any kind of solutions other than those specified above.

advance thanks...

I have 3 check boxes and one submit button when the submit button is hit I need it to direct to one of 3 pages depending on which check box is checked.
can anyone help with this

Thanks!

I've got a client using JQuery pageslide function on a wordpress site - http://srobbin.com/blog/jquery-pageslide/

There is a sidebar menu on the left and about 5 pages in the right hand side. So you click one of the links on the sidebar menu and it slides to one of the 5 corresponding pages. I guess the 5 pages are all really one page though within the slider app? I'm wondering if it's possible to link directly to a page within the slider... because right now it always goes to the first page of the 5. And is there a way to program it so the back button in the browser makes the page slide go back to the previous page, rather than going to the last actual page in the browser?

I have the following script in my page

Code:

var tickspeed=4000 
var enablesubject=0 

if (document.getElementById){
document.write('<style type="text/css">\n')
document.write('.dropcontent{display:none;}\n')
document.write('</style>\n')
}

var firstDiv=0
var allDivs=0

function contractall(){
var inc=0
while (document.getElementById("dropmsg"+inc)){
document.getElementById("dropmsg"+inc).style.display="none"
inc++
}
}

function expandone(){
var firstDivObj=document.getElementById("dropmsg"+firstDiv)
contractall()
document.getElementById("dropcontentsubject").innerHTML=firstDivObj.getAttribute("subject")
firstDivObj.style.display="block"
firstDiv=(firstDiv<allDivs-1)? firstDiv+1 : 0
setTimeout("expandone()",tickspeed)
}

function startscroller(){
while (document.getElementById("dropmsg"+allDivs)!=null)
allDivs++
expandone()
if (!enablesubject)
document.getElementById("dropcontentsubject").style.display="none"
}

if (window.addEventListener)
window.addEventListener("load", startscroller, false)
else if (window.attachEvent)
window.attachEvent("onload", startscroller)

I also have the following in my html:

Code:

<div id="dropcontentsubject"></div>
 <div id="dropmsg0" class="dropcontent" subject=""></div>

There are a total of 4 dropmsg# divs. I need to be able to input 4 navigation buttons below this code that will, when clicked, pause the ticker and go directly to the "dropmsg#" assigned to that button.

I would deeply appreciate any assistance with this. Thank you.

Hi
I'm new to javascript, so this is probably very simple. I've created a form with combobox with different values (this is for my website). What I want is when the user clicks 'submit' that it goes to a different page on the website depending on the value the person has selected in the combobox. Values are numerical, for example 1000, 2000, 5000 etc. I've been trying this for a couple of days now without success!
Thanks in advance

On my site's shopping cart, when clicking the "buy" button, it merely animates a little item that shows that something is now in the customer's cart. I'd like it to do this, and then redirect to "/cart", cutting down the work of what the user actually has to do (we only have one product).

Here's what I'm working with:

<!-- START ADD TO CART -->
{% if featuredproduct.available %}
<span class="featured-product price"><span>{{ featuredproduct.price | money }}</span>{% if featuredproduct.compare_at_price_max > featuredproduct.price %} <del>{{ featuredproduct.compare_at_price | money }}</del>{% endif %}</span>

<input type="submit" value="{{ settings.text_addtocart }}" class=" add-to-cart addtocart button primary">

{% else %}
<h3 class="featured-product price sold-out"><span>Sold Out</span></h3>
<input type="submit" value="{{ settings.text_addtocart }}" class="featured-product add-to-cart button primary disabled" disabled="disabled ">
{% endif %}
<!-- END ADD TO CART -->

Adding an "onclick="location.href='/cart';" after the input classes does not fire the actual act of adding the item to the cart, so it shows an empty cart on the redirect.

JS newbie, sorry for the rough explanation. Any help greatly appreciated!

Hello all, I made a fade script that will fade any element in or out. Works great on all browser I've tested but IE 7. With IE I have only tested this will IE 8 and IE 7. IE 7 the effect doesn't work. No error message or anything. I'm unsure what to do from here. I was hoping I could find some help here.

Code:

function fade(obj, duration, toggle) {
	steps = 1000;
	elem = document.getElementById(obj);
		
	function fadeIn() {
		for(var i = 0; i <= 1; i+=(1/steps)) {
				setTimeout("elem.style.opacity = "+ i +"", i * duration);
				setTimeout("elem.style.filter='alpha(opacity="+ i * 102 +")'", i * duration);
		}
	}
	
	function fadeOut() {
		for(var i = 0; i <= 1; i+=(1/steps)) {
				setTimeout("elem.style.opacity = "+ (1-i) +"", i * duration);
				setTimeout("elem.style.filter='alpha(opacity="+ (1-i) * 102 +")'", i * duration);
		}
	}
	
	/* One for Fade in and anything will be fade out*/
	if(toggle == 1) {
	fadeIn();
	}
	else {
	fadeOut();
	}
	
}

Thanks,
Jon W

Hi

I'm doing some js online tutorials and am stuck at this piece of code. It's supposed to be a carousel that loops. It's supposed to have the main image in the middle and images on either side of it. Something similar to www.atlanticrecords.com.

But my code doesn't make it slide. I'm a complete novice to javascript and am desparate for this to work.

This is the code if anyone would like to show me my mistakes.

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Interactive Carousel</title>

<style type="text/css">
#feature_holder{position:relative; top:150px; overflow:hidden; height:400px; width:100%;}
.feature{position:absolute; width:1000px; height:400px; top:0; z-index:1;}
.arrow_right{right:20px;}
.arrow_left{left:20px;}
.arrow{height: 70px; width:70px; z-index:2; top:160px; position:absolute; background:#000;}
#feature_1{background: #666666;}
#feature_2{background: #225566;}
#feature_3{background: #006600;}
#feature_4{background: #ff0066;}
#feature_5{background: #00ff00;}
#feature_6{background: #0380ff;}
</style>
</head>

<body>
<div id="feature_holder">
<div class="arrow arrow_left"></div>
<div class="arrow arrow_right"></div>
<div class="feature" id="feature_1"></div>
<div class="feature" id="feature_2"></div>
<div class="feature" id="feature_3"></div>
<div class="feature" id="feature_4"></div>
<div class="feature" id="feature_5"></div>
<div class="feature" id="feature_6"></div>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>

<script>
var BrowserWidth
var FeatureCount
var CurrentFeature = 1
var NextFeature
var NextNextFeature
var PrevFeature
var PrevPrevFeature

$(document).ready (function(){
	setFeatureCount()
	getBrowserWidth()
	setClicks()
	setNextPrev()
	setFeaturePosition()
});


setFeatureCount = function(){
	FeatureCount = $('#feature_holder').children('.feature').length;
}

getBrowserWidth = function(){
	BrowserWidth = $(window).width();	
}

setClicks = function(){
	$('#feature_holder').children('.arrow_left').click(function(){
		SlideInFeature(true);
	});
	$('#feature_holder').children('.arrow_right').click(function(){
		SlideInFeature(false);
	});
}

setNextPrev = function(){
	PrevFeature = (CurrentFeature-1);
	PrevPrevFeature = (CurrentFeature-2);
	NextFeature = (CurrentFeature+1);
	NextNextFeature = (CurrentFeature+2);


if (CurrentFeature == 1){
	PrevFeature = FeatureCount;}
	
setFeaturePosition = function(){
	$('#feature_holder').children('.feature').css('left', -9999);
	
	var CurrentPositioning = (BrowserWidth/2) - 500;
	$('#feature_'+CurrentFeature).css('left', CurrentPositioning);
	
	var NextPositioning = (BrowserWidth/2) + 500;
	$('#feature_' +NextFeature).css('left', NextPositioning);
	
	var PrevPositioning = (BrowserWidth/2) - 1500;
	$('#feature_'+PrevFeature).css('left', PrevPositioning);
}}
</script>
</body>
</html>

Thanks

Can somebody give me a bit of help with the below code. The problem is that it works fine for the first pop up box but not for the other(s). I think it has something to do with the script using the getelementbyid. Can anybody help?

Code:

<script type="text/javascript">
var appearance = "notShown"
function show()
{
if (appearance == "notShown")
{
document.getElementById('P1').style.display = "inline";
appearance = "shown";
}
}

function remove()
{
document.getElementById('P1').style.display = "none";
appearance = "notShown"; 
}
</script>


<style type="text/css">
p#P1 { width: 319px; height: 169px; display:none; background-color: grey; position:absolute;z-index:2; }

p#P1 b { padding: 10px; float: left; }

p#P1 span  { width: 300px; float: left; padding: 10px;}

button.close {float:right; margin: 5px; }
</style>


<a href="#" onclick="show()">box 1</a>

<p id="P1"><b>Lorem Ipsum</b><button type="button" class="close" onclick="remove()">X</button>

<span>Lorem ipsum ut volumus antiopam pericula vix, per nulla oblique alienum ad. No ullum convenire eos. Sit tota iusto ut, ex mentitum voluptatum inciderint est. Ex dico idque argumentum eam, ei elit meliore definiebas per, nam soleat aliquando ad.</span>

</p>


<br /><br /><br /><br /><br /><br />


<a href="#" onclick="show()">box 2</a>

<p id="P1"><b>Lorem Ipsum</b><button type="button" class="close" onclick="remove()">X</button>

<span>Lorem ipsum ut volumus antiopam pericula vix, per nulla oblique alienum ad. No ullum convenire eos. Sit tota iusto ut, ex mentitum voluptatum inciderint est. Ex dico idque argumentum eam, ei elit meliore definiebas per, nam soleat aliquando ad.</span>

Hi there! I'm completely new to javascript coding, but have suddenly found myself in need of using it. here's a little background (helps me keep track of where I am in my question).

I've been "playing" with php for quite a while, and I decided I wanted to see how hard it would be to code a fairly simple forum. So far, everything is working out with very little need for bug fixes and some efficiency suggestins from a friend.

I'm currently building the registration page, and wanted to have it compare the password and verification while the form is being filled. I found a code to do it after a few searches, but evidently I am missing something about how it works.

This is the code I found:
Code:

<script type='text/javascript'> 
 function comparePasswords()
  {
   if(document.getElementById('pass1').value != document.getElementById('pass2').value)
    {
     $('passwordShow').innerHTML = 'Passwords do not match';
    }
   else
    {
     $('passwordShow').innerHTML = '';
    }
  }
</script>

This is the full code for the form I am trying to use it in:
Code:

<?php
 echo "<script type='text/javascript'>\n function comparePasswords()\n  {\n   if(document.getElementById";
 echo "('pass1').value != document.getElementById('pass2').value)\n    {\n     $('passwordShow').innerHTML";
 echo " = 'Passwords do not match';\n    }\n   else\n    {\n     $('passwordShow').innerHTML = '';\n";
 echo "    }\n  }\n</script> ";

 echo "<form action='index.php?pg=verify' method='post'>";
 echo "<table align='center' style='color: #C0C0C0'>";
 echo "<tr><td>Username:</td><td><input type='text' name='user' /></td></tr>";
 echo "<tr><td>Password:</td><td><input type='password' name='pass1' /></td></tr>";
 echo "<tr><td>Re-enter Password</td><td><input type='password' name='pass2' onkeyup='comparePasswords();' /></td></tr>";
 echo "<tr><td>Email<br />(used for password recovery)</td><td><input type='text' name='email' /></td></tr>";
 require ('questions.php');
 echo "<input type='hidden' name='source' value='reg' />";
 echo "<br><center><input type='submit'/></form>";
?>

What am I not understanding about this?

Hello again,

I have written the following code:


<script language="Javascript">
var win=0
</script>
<Form name="Form">
<Input type="button" name="button" value="Click" onClick="Good()">
</form>
<script language="Javascript">
function Good()
{
if (win=0)
{
alert('You win!')
}
else
{
alert("You lose!")
}
}
</script>

Based on the following, when I click the button it should say "You win!" as win=0 but it keeps saying "You lose!". Why is this happening?

I know we've all seen those text fields where when you type in am HTML tag it changes color!
Example:
<div> blah blah blah blah </div>
I know that there is no flash involved, so how does it work?

hello,

I found this script : http://roshanbh.com.np/2008/06/accor...ng-jquery.html

I implemted this into my website http://test.tamarawobben.nl
but as you can see it don't work.

Can anyone help me figure out why the script does not work.

Roelof