|
JavaScript - Help With Pikachoose In An Iframe? Odd Issue With Url Target
Anyone familiar enough with pikachoose to help me out here? Using a pikachoose slideshow inside an iframe and for some reason adding a url target of _top or _parent is not working. It just opens up the link in the iframe window no matter what i do. Anyone with an idea of how to fix this?
I'm working on it in the staging area of my site- http://staging.susanb.com/ You can see when you click on one of the images it doesnt fill the entire window This just creeped up on me at the end of a project so im hoping its not a deal breaker thanks in advance!! Similar TutorialsHello. I have built a basic website that contains an iframe in the middle, called "iframe1". In this iframe I wish to load an external message board from proboards.com. In my code I can easily do this by making a button or hyper-link with the href="httproboards.com/myforums" and the rel="nofollow" target="iframe1" When I do this it will load inside of it the iframe jsut as I want it to. However, my the problem is when you click on the button to login its coded to target "_top" and it opens on the entire page replacing the whole website. If i run firebug (a real time HTML editor). I can easily locate and change the link code to rel="nofollow" target="iframe1". But How can I write a script in javascript in my webpage code to do this as soon as the iframe has loaded the external messageboard? I have also been trying things like javascript:void(document.iframe1.getElementsByTag("a")[5].rel="nofollow" target="iframe1") but i have had no luck so far in changing the target without the aid of firebug. Here is the code that needs to be changed. the rel="nofollow" target="_top" needs to be altered somehow to rel="nofollow" target="iframe1" as soon as the frame has finished loading the messageboards. Code: <p><font size="2"> Welcome Guest. Please <a href="/index.cgi?action=login" rel="nofollow" target="_top">Login</a> or <a href="/index.cgi?action=register" rel="nofollow" target="_top">Register</a>.<br/>Nov 19, 2010, 7:23pm </font><br /></p> Heres a screenshot that may help, as you can see I have easily changed the target of the link to="iframe1" using firebug, but I need to hardcode a script in my website that does this automatically after the iframe has loaded the forums page. http://img191.imageshack.us/img191/7264/26796014.jpg Thanks to for any help. I know next to nothing about javascript and I don't even know if this is possible. I need to target window.location.href to an iframe on a different page. So, right now, the piece of the code that redirects the browser looks like this: Code: window.location.href='http://www.somewhere.com/'; Works great, brings it up in the same browser window. So now I need to modify the code so it goes to a different page and brings that page up in a specified iframe. I hope this makes sense. I really need help. And if it is not possible, I just need to know to abandon all hope. Hello, I have a working Pikachoose. Seems so easy to to set this up, but I have one problem. The 'next' and 'previous' text I'd like to remove. Just wondering how I go about doing this? Thanks I am using the following javascript on the target page to open it as top location from within an iframe, which is working ok. Code: <script type="text/javascript">
if(self!=top) {
top.location.href=location.href
}
</script>
However my problem occurs when the user uses the browsers back arrow to return to the previous page, the script executes again returning them once more to the page they have come from. Is anyone aware of a work around to this problem as it would seem there isn't one? perhaps even a better solution for opening the target page from the iframe as top location. This is really causing confusion for users, and I really need to get the issue fixed. Thanks for any assist. I'm totally stumped. Check this out: http://174.37.72.84/portfolios/engagements/ It works in FF and Safari, but not IE. Everything validates, and I'm getting no JS errors. Anybody have any ideas? Thanks I am currently working on a simple site and I was looking into methods to take advantage of html partial rendering to make site maintenance easier without using a server side language. The code for the two pages is as follows: Main html page: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<link href="../css/main.css" rel="stylesheet" type="text/css"/>
<link href="../css/default.css" rel="stylesheet" type="text/css"/>
<title>Default</title>
</head>
<body>
<div class="navigation" id="nav_div">
<iframe name="nav_frame" onload="loadNav()"></iframe>
</div>
<script type="text/javascript" language="javascript">
<!--
function loadNav()
{
nav_frame.location="../static_partials/navigation.htm";
}
//-->
</script>
</body>
</html>
And the code of navigation.htm is: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<script type="text/javascript" language="javascript">
<!--
function iframeLoad()
{
parent.document.getElementById("nav_div").innerHTML = document.getElementById("navigation_divs").innerHTML;
}
//-->
</script>
<title>Navigation Partial</title>
</head>
<body onload="iframeLoad()">
<div id="navigation_divs">
</div>
</body>
</html>
The works fine in IE, but in Firefox 3.5.7 the iframeLoad generates an exception. The exception states the following: Code: Permission denied for <file://> to get property Window.document from <file://>. Firefox doesn't seem to like my usage of the parent object in that way, but I am unsure of another way to do it without using a server side language. Hi, folks! Having a big issue he i got a code that works fine in Chrome, FF, but seems unreadable by IE. Got a main HTML code that have a DIV tag, declared like this Code: <div id='leframe' style='visibility:hidden'></div> Then, I call, through a Flash file, an external function that says: Code: function loadNextPg(nextPg) {
var varDiv = "<iframe src='pg"+nextPg+".htm'></iframe>";
document.getElementById("leframe").innerHTML = varDiv;
}
}
It would load the HTML named (pg'+nextPg+'.htm), where nextPg is a String value ("01", "02", etc). It works WONDERFULLY in Chrome, FF, etc, but not in IE. Does anyone know if I'm doing anything wrong? Best regards and thanks in advance. Hello I have several issues with my multilevel drop down menu The First issue is : the page has 2 iframes (one has the horizontal multilevel drop down menu on the top) the below iframe has my site address Now, when i hover over the menu it does not open or expand but when i open just the menu without any iframes it does This clearly means that the menu is not coming out of the iframe Please help me bring it on top of everything of the page Note: i have placed the menu in one iframe and a page opens below it in another iframe. The Second issue is : I want the navigation bar that is the multilevel drop down menu to be editable Which means i have a blog and a forum on my site but my visitor wants that the blog should not appear there and another link to play games should be there and hence he/she can edit it And please also try to make it work on cookies so that the user info and preferences are saved in cookies and whenever he/she comes back they see the page their way. For you: I would like to tell you that IdeaLab has launched a Twitter Advertising, Widget and Search platform and the first 1000 people are getting $100 go to tweetup.com Please help me, it will be really appreciable. Thank you very much in advance! Hey guys, I'm trying to obtain the object of the element on the page that is clicked, but my code is unable to set the target. Here's what I have. The JavaScript Code: function show_info(e){
//get the targeted element.
var targ;
if (!e) var e = window.event;
if (e.target) targ = e.target;
else if (e.srcElement) targ = e.srcElement;
if (targ.nodeType == 3) targ = targ.parentNode;
alert (targ); //FAIL!
}
The Form Code: <form action="#" method="post"> <input type="hidden" name\"id" value="" /> <input type="submit" name="submit" value="Info" onclick="show_info()"/> </form> What I want to do is get the target element(the submit button) so that I can get its sibling(it contains a unique ID). But it's not working. Is there a way to resize an iframe dynamically so that you never get the scroll bar and essentially hide that there is an iframe? Better integration really. Basically I want to iframe a forum into my site so that the design down the sides and top which my friend does using iweb are not messed with. We have a central area which can be longer or shorter depending on the forum. Hi all, I hope you can help I have some code which: 1) Opens a URL (e.g. google.com) in a hidden iframe, then 2) Redirects the visitor to a different URL (e.g. yahoo.com) after it has loaded... This works exactly as I need. What I'd like to do is the following: 1) Open a URL (e.g. google.com) in a hidden iframe, then 2) Redirect the visitor to a different URL (e.g. yahoo.com) in a full-screen iframe 3) The address bar of the full-screen iframe should be my domain (obviously!) Here's what I have so far... Hidden iframe -> New URL Code: Code: <html>
<body>
<script type="text/javascript">
var page_body = document.getElementsByTagName('body');
var myframe = document.createElement('iframe');
var id = Math.random();
myframe.setAttribute('id', 'myFrame'+id);
myframe.src = 'http://google.com'; //First open Google in hidden iframe
myframe.setAttribute('frameborder', '0')
myframe.setAttribute('width', '0');
myframe.setAttribute('height', '0');
if (myframe.attachEvent)
{
myframe.attachEvent('onload', function()
{
top.location = 'http://yahoo.com'; //Once loaded redirect to Yahoo -- but the address bar shows yahoo.com -- I want the address bar to display mydomain.com/page.html
});
}
else if (myframe.addEventListener)
{
myframe.addEventListener('load', function()
{
top.location = ('http://yahoo.com');
}, false);
}
page_body[0].appendChild(myframe);
</script>
</body>
</html>
I have an example of some code which displays the full screen iframe, but my problem is... ...I can't figure out how to redirect to this after the hidden iframe has loaded Here's an example of how I want the redirect to display -- after the initial hidden iframe has loaded: Code: <html>
<head>
<script type="text/javascript">
function sendParams() {
document.body.style.overflow = "hidden";
}
</script>
</head>
<body>
<!--Open Yahoo.com in a full screen iframe, and disable extra scrollbar -->
<iframe height="100%" width="100%" frameBorder="no" onload="sendParams()" src="http://yahoo.com"></iframe>
</body>
</html>
I've been beating my head against the wall today trying to figure this out, and I'm fresh out of ideas. If you can help, you'll have some serious gratitude and good karma thrown your way! Best wishes, and thanks in advance, Paul Hi there everybody, I've got this problem which I can't solve myself... I've got a website which has 3 colums and is hosted on domain1.com. in the right column I've got an Iframe which loads content from domain2.com . this content are some textboxes and a datepicker tool. if I press the 'search'-button in this Iframe I would like to refresh the mainpage (from domain1.com) so that another Iframe appears in the middle column. in this column i would like to load a new form from domain2.com which contains the values that I've put in in the form from the right Iframe. Unfortunally I can't get this to work... Will somebody please help me? Hi guys I was wondering if its possible in javascript to do something like this: Code: document.getElementById('div').children('img').style
This is my code with int value I can target children is this also possible with a string like img? 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" dir="ltr" lang="en-gb" xml:lang="en-gb">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<script type="text/javascript">
window.onload=function()
{
var d = document;
var e = d.getElementById('t');
e.children[0].style.border = "solid black 1px";
}
</script>
</head>
<body>
<div id="t">
<img width="120" height="80" src="./images/full6.jpg" alt="" />
<img width="120" height="80" src="./images/full6.jpg" alt="" />
<img width="120" height="80" src="./images/full6.jpg" alt="" />
<img width="120" height="80" src="./images/full6.jpg" alt="" />
</div>
</body>
</html>
tested this only on FF. Code: target = this.parentNode.parentNode.getElementsByClassName('help')[0];
target.style.display = (target.style.display=='none')?'inline':'none';
-->Error: target.style is undefined In next two codes what is red is different, all the rest as above. Code: var target = this.parentNode.parentNode.getElementsByClassName('help')[0];
target.style.display = (target.style.display=='none')?'inline':'none';
--> works. Code: xxx = this.parentNode.parentNode.getElementsByClassName('help')[0];
xxx .style.display = ( xxx .style.display=='none')?'inline':'none';
--> works. Why is that ? Hoping someone can help a simple soul!! I am trying to work out if there is a way that I can use a target url as a simple password (or even username) at a log in screen. Essentially I want to be able to send people to a different URL depending on their login details but without having to do anything too complicated or secure. Hoping someone can help Thanks in advance! Need help adding var target to this form action Would This be correct? var form = inp.form; form.target = "_self"; Code: <html>
</head>
<script type="text/javascript">
function formop(inp,op)
{
var form = inp.form;
form.action = op + ".php";
var temp = inp.id.split(",");
form.id.value = temp[0];
form.FirstName.value = temp[1];
form.LastName.value = temp[2];
}
</script>
</head>
<body>
<form method="post">
<input type="hidden" name="id">
<input type="hidden" name="FirstName">
<input type="hidden" name="LastName">
<input type='image' id='show,me,data' onclick=formop(this,'add'); src='static/icon16/add.jpg'>
<input type='image' id='show,me,data' onclick=formop(this,'edit'); src='static/icon16/edit.jpg'>
<input type='image' id='show,me,data' onclick=formop(this,'delete'); src='static/icon16/delete.jpg'>
</form>
</body>
I have a few banners and forms that I wish to open in a new tab not the same window or a new window. I have tried the deprecated Code: target="_blank" but even that opens a new window. I have done some research on google and came up with CSS code: Code: form[target] {
target-name: new;
target-new: tab;
}
a[target] {
target-name: new;
target-new: tab;
}
This however does not work and opens in the same window. When using the CSS I remove the inline target. Any Ideas on how to fix this? I've been doing some searching and I can't seem to find what I am looking for. I hope someone can help. I am trying to target a link to an iframe window. The catch is that I need to use an onClick function in a TD tag... Here is an example: <TABLE HEIGHT="40" WIDTH="780" CELLSPACING="0" CELLPADDING="0" BORDER="1"> <TBODY> <TR> <TD ALIGN="CENTER">HEADER 1</TD> </TR> <TR> <TD OnClick="location='http://www.ophil.com'" BGCOLOR="#FFFFFF">Ophil</TD> </TR> </TBODY> </TABLE> </TD> </TR> <table width="100%" border="0" cellspacing="0" cellpadding="1"> <tr> <td><a name="bidframe"> <IFRAME SRC="bid_item_instructions.html" TITLE="IFRAME" SCROLLING="no" NAME="bidpage" WIDTH="100%" HEIGHT="450" ALIGN="center" FRAMEBORDER="yes" > </IFRAME> </a></td> </tr> </table> </CENTER> </BODY> </HTML> I need the results of that onclick to appear in the iframe window I have called bidframe... Any ideas? I have an ajax tabbed site which loads the content in the div below it. I made a drop down link so that the user could select one of 3 on one tab but this is outside of the script.js. I'm wondering if there's a way to get the target of these drop down links to open in the div below instead of a new tab? http://voiceprocess.net/script.js <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Home Improvement Survey Process</title> <link href="../../../voiceprocess.ico" rel="shortcut Icon"> <link rel="stylesheet" type="text/css" href="../styles.css" /> <link href="../dropdown.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="jquery.min.js"></script> <script type="text/javascript" src="script.js"></script> </head> <body> <div id="main" style="float:left"> <table width="991" border="0" cellpadding="0"> <tr> <td width="649"><ul class="tabContainer"> <!-- The jQuery generated tabs go here --> </ul></td> <td width="75" style="padding-bottom:43px"> <div id="centeredmenu" style=" width:0px; height:0px"> <ul > <li style="padding-left:0px"><span class="sears"><a href="#')"> </a></span> <ul style="padding-top:2px"> <span class="space"></span><span class="space"></span> <li><a href="pages/sears_refacing.html" target="_self">Cabinets Refacing</a> <div> <li><a href="pages/sears_hvac.html">HVAC </a></li> <li><a href="pages/sears_windows.html"></a>New Windows </a></li> </ul> </li> </div></td> <td width="241"><a href="upsell.php" target="_blank"><img src="../u.png" alt="" width="26" height="37" border="0" style="padding-bottom:5px"/></a> <a href="../data.html" target="_blank"><img src="../s.png" alt="" width="29" height="37" border="0" style="padding-bottom:5px"/></a><img src="../../../images/logosm.png" alt="" width="158" height="42" hspace="10" /> </td> </tr> </table> <div id="tabContent"> <div id="contentHolder"> <!-- The AJAX fetched content goes here --> </div> </div> </body> </html> |
|||||||