Calling a function in Iframe from main page help please!

[shellymabelly83]

Ok so I have a few questions here. I want my function to work inside the Iframe, but I want to call it from outside the Iframe, the main page. The iframe is going to be doing the same jquery function as the inframe only I want them to go in different directions (scrolling). The trigger for the function of the jquery on the main page is on click of the link. I want the jquery function inide the iframe to trigger on the same click(the click of the link on the main page)

Here is my code:

Main Page Code:


<iframe style="position:absolute; width:25%; height:1000%; z-index: 80; FILTER: chroma (color=FFFFFF)" src="extra.html" frameborder="0" id="section" class="nav">


<script type="text/javascript">

function putme() {
window.frames['section'].putme();
}

$(function() {
$('ul.nav a').bind('click',function(event){
var $anchor = $(this);

$('html, body').stop().animate({
scrollTop: $($anchor.attr('href')).offset().top
}, 7500,'easeInOutExpo');

event.preventDefault();
});
});

</script>


</iframe>


Here is the page being loaded into the Iframe code:


<script type="text/javascript">

function putme() {
window.frames['section'].putme();
}

$(function() {
$('ul.nav a').bind('click',function(event){
var $anchor = $(this);

$('html, body').stop().animate({
scrollTop: $($anchor.attr('href')).offset().top
}, 7500,'easeInOutExpo');

event.preventDefault();
});
});


</script>

[shellymabelly83]

I can post my test page if needed

[djr33]

There are security reasons that sometimes it won't work. If you're using the same domain, then it will probably be possible. I'm not sure what's specifically wrong here, but check the domains first.

Another detail is that "www.yoursite.com" and "yoursite.com" are actually different domains (subdomains), so you need to make sure they match.

[shellymabelly83]

They are in the same domain name.

I am just in the local testing phases so I am using extra.html instead of www.mydomainname.com/extra.html, but I will make sure to fix it once I upload to the server.

[jscheuer1]

Anything in the red area is ignored by browsers which support iframe:


<iframe src="whatever" other attributes and/or style>
RED ZONE
</iframe>

So, from your first post:



<iframe style="position:absolute; width:25%; height:1000%; z-index: 80; FILTER: chroma (color=FFFFFF)" src="extra.html" frameborder="0" id="section" class="nav">


<script type="text/javascript">

function putme() {
window.frames['section'].putme();
}

$(function() {
$('ul.nav a').bind('click',function(event){
var $anchor = $(this);

$('html, body').stop().animate({
scrollTop: $($anchor.attr('href')).offset().top
}, 7500,'easeInOutExpo');

event.preventDefault();
});
});

</script>


</iframe>

All that (red) is ignored. If you want it to do anything at all, it must be outside the iframe tag. There could also be other problems.


If you want more help - please define what you want your function to do and when, and please provide a link to your page.