|
JavaScript - Inline Modal Window Of Soh Tanaka Is Not Working In Ie 9
Hi,
well i used soh tanaka inline modal window which is a popup window like lightbox. But it failed to work with IE9 RELEASED CANDIDATE VERSION. Can anyone tell me that why is it having issue with a better version of explorer. I have made a video to show the error, as to make it more easy to explain what i am saying. here is the link to it http://www.youtube.com/watch?v=pHi9ZlGyWc0 i would look forward to the replies. thank you. Similar Tutorialsi have some really annoying issues with a widget which is known inline modal you can see that widget after you click the play button in the given link below, please help me out, the issue is that use google chrome and then go to this place, the link is: http://www.bloghuts.com/2010/09/star-island.html and in this page click on play, then you yourself will see the error, please tell me what to do with this error. And another problem is that again open the above link in internet explorer and click the play button you will see a different kind of annoying problem, except these two explorers it works fine, PLEASE HELP ME I WOULD REALLY BE THANKFUL TO YOU. Hi all! I am struggling with getting a modal window to launch. The two problems I experience are as follows: 1) Images do not display in IE within the hidden <div> tags. (This I tested on another page less complicated. Click the "donate" button on this page using IE and firefox to see what I mean... http://www.clanreportdb.co.uk/report...ls.php?id=1473) 2) When integrating the <a> tag link to launch within PHP code, it fails to work. Here is my code, and hopefully someone will know what I am doing wrong: Code: <html>
<head>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
//When you click on a link with class of poplight and the href starts with a #
$('a.poplight[href^=#]').click(function() {
var popID = $(this).attr('rel'); //Get Popup Name
var popURL = $(this).attr('href'); //Get Popup href to define size
//Pull Query & Variables from href URL
var query= popURL.split('?');
var dim= query[1].split('&');
var popWidth = dim[0].split('=')[1]; //Gets the first query string value
//Fade in the Popup and add close button
$('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="/report/images/close.gif" border="0" class="btn_close" title="Close Window" alt="Close" /></a>');
//Define margin for center alignment (vertical horizontal) - we add 80px to the height/width to accomodate for the padding and border width defined in the css
var popMargTop = ($('#' + popID).height() + 80) / 2;
var popMargLeft = ($('#' + popID).width() + 80) / 2;
//Apply Margin to Popup
$('#' + popID).css({
'margin-top' : -popMargTop,
'margin-left' : -popMargLeft
});
//Fade in Background
$('body').append('<div id="fade"></div>'); //Add the fade layer to bottom of the body tag.
$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'}) is used to fix the IE Bug on fading transparencies
return false;
});
//Close Popups and Fade Layer
$('a.close, #fade').live('click', function() { //When clicking on the close or fade layer...
$('#fade , .popup_block').fadeOut(function() {
$('#fade, a.close').remove(); //fade them both out
});
return false;
});
});
</script>
<style type="text/css">
#fade { /*--Transparent background layer--*/
display: none; /*--hidden by default--*/
background: #000;
position: fixed; left: 0; top: 0;
width: 100%; height: 100%;
opacity: .80;
z-index: 9999;
}
.popup_block{
display: none; /*--hidden by default--*/
background: <? echo $highlightbg; ?>;
padding: 20px;
border: 20px solid #ddd;
float: left;
font-size: 1.2em;
position: fixed;
top: 50%; left: 50%;
z-index: 99999;
/*--CSS3 Box Shadows--*/
-webkit-box-shadow: 0px 0px 20px #000;
-moz-box-shadow: 0px 0px 20px #000;
box-shadow: 0px 0px 20px #000;
/*--CSS3 Rounded Corners--*/
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
img.btn_close {
float: right;
margin: -55px -55px 0 0;
}
/*--Making IE6 Understand Fixed Positioning--*/
*html #fade {
position: absolute;
}
*html .popup_block {
position: absolute;
}
</style>
</head>
</html>
<?php
foreach ($d as $f)
{
echo "{$f[1]}<a href=\"#?w=500\" rel=\"popup_name\" class=\"poplight\"><img src=\"/report/images/tick.gif\" border=\"0\"></a>";
?>
<html>
<div id="popup_name" class="popup_block">
//CONTENT HERE eg. <? echo $f[2]; ?>
//Image does not display in IE but does in firefox
<img src="/report/yes.gif">
</div>
</html>
<?
}
?>
I am working on my homework. On my page, I need to make a modal window, which is just a picture has x or close letter, shows up whenever people open the page. So far, I called a picture with onload in a body and centered the picture. I don't know if there is anyway that I can just put x or close somewhere so that whenever people click x or close, the picture is not going to be visible ( promoPic.style.visibility = "hidden" this is my code for the picture. And I though I can just put input button or any letters inside of picture because its wrapped by paragraph, but, I can't. I guess I am miss understanding some concept? Code: <body onload="promoCenter()"><p><img src="http://codingforums.com/images/hauntedHouse.jpg" id="promoPic" alt="Haunted House" height="400" width="400" /></p> Hi. I have a page in a modal window that fades in over the top of my site when clicked. When this page comes up in Google and is clicked it does not load up the site with the modal window over top, it just loads the content of the modal window on a full page. Is there a way to have the link on Google go to the page with the modal window over top? The modal window is "PrettyPhoto" using JQuery. Thanks in advance. Hi, I am working on a project in which I have to open my flash demo in a modal window. I got all the code for modal window and it is working great. The only problem is I am not able to open a flash file in modal window. Can any one guide me or suggest me how should I fix this. Thanks in advance. Vikrant Hi, I am writing an application which needs to open a modal dialog window in a secure connection. I am able to open the dialog using HTTPS, but on the status bar I cannot see the SSL Padlock. The application is being written in .NET and the browser I use is IE 6.0. Any suggestions and feedback are welcome. Regards Totre Hi, I have a JQuery modal window and I am trying to pass the value of its input field to a hidden input field within a form but I can not seem to get the value when it is in the modal window. Modal Window Code: Code: <div id="modal-content" class="clearfix"> <h2> enter a name</h2> <div> <input id="enteredName" name="enteredName" type="text" value="" /> <a href="javascript:submitform(true)" name="save" id="save" class="btn"><span>Save</span></a> </div> <a href="javascript:submitform(false)" id="close" class="close-link">No thanks just carry on</a> </div> Javascript to set the value of the hidden field to equal the value of the modal input field Code: <script type="text/javascript">
function submitform(assignName) {
if (assignName) {
var hiddenfield = document.getElementById("hiddenfieldid");
hiddenfield.value = document.getElementById("enteredName").value;
}
var form = document.getElementById("formTest");
form.submit();
}
</script>
Any help would be much appreciated. On my main page, I have a list of item ID's which are assigned variables, the list is concatenated and so the variables are always different. So another thing that gets concatenated is a link, which uses javascript/jquery to open a popout modal window which is another php file called sharepost.php. I want to be able to transfer the php variables from the main page to append them on the end of the sharepost.php URL so I can use $_GET to grab them for use. Here's what I have... not working, but I figured I'd give it a try. Code: <?php
//use mysql to loop through some variables
$post_id = $setvalue;
$member_id = $anothersetvalue;
$list .= '
<div>
' . $post_id . '
</div>
<div>
' . $member_id . '
</div>
<div>
<a href="#" class="button" onClick="openup(); return false">Share This Post</a>
</div>
$the_link = " http://sharepost.php?post_id=' . $post_id . '&member_id=' . $member_id . ' ";
';
?>
<HTML>
<head>
<script>
// Displays an external page using an iframe
function openup(){
var src = "<?php echo $the_link;?>";
$.modal('<iframe src="' + src + '" height="450" width="830" style="border:0">', {
closeHTML:"",
containerCss:{
height:150,
padding:0,
width:350
},
overlayClose:true,
});
}
</script>
</head>
<body>
<?php echo $list;?>
</body>
</HTML>
Hey there everyone I'm a bit new to javascript and having a bit of a problem. I have a page users can click to upload a photo. When users click I want a modal window to pop up with a simple file upload input inside it and a submit button. I have this working except that when users click submit nothing happens. I'm using nyroModal http://nyromodal.nyrodev.com/#demos and the code I use is: Code: <a href="#test" class="nyroModal"><img src="/img/uploadimage.gif" alt="" /></a> <div id="test" style="display: none; width: 600px;"> <form id="ImageUploadForm" enctype="multipart/form-data" method="post" action="images/upload" accept-charset="utf-8"> <div style="display:none;"> <input type="hidden" name="_method" value="POST" /> </div> <div class="input file"> <label for="ImageFileName">File Name</label> <input type="file" name="data[Image][fileName]" id="ImageFileName" /> </div> <div class="submit"><input type="submit" value="Upload" /> </div> </form> </div> If I take the code out of the div=id"test" the form appears on the normal page and submits just fine. Inside the test div tho the modal window pops up with the form inside but the submit button does nothing. Can anyone enlighten me what I'm doing wrong? Hi guys, I have read that the window.close won't work unless the window was opened through window.open. Eventhough I have the window opening through window.open method the window.close simply wont close the window. Below is my code. I appreciate you help as I am desperate to finish my project and this is the only thing between me and the closed project. I have this in the <head> in the parent window. Code: <script language="javascript">
function MM_openBrWindow(theURL,winName,features){
var left = (screen.width/2)-(800/2);
var top = (screen.height/2)-(560/2);
features = features + ",left=" + left;
window.open(theURL,winName,features);
}
</script>
the left and top is to center the window which is working. Then I have the below code in my button which is to open the window. Code: <input type="button" value="E-MAIL" onClick="MM_openBrWindow('email.php?camp_id=<?php echo $encrypted; ?>','','width=860,height=600'); return false"/>
The $encrypted is created beforehand and the window gets opened as well. Now in the popup window... Up on submitting a form, I need the popup to close after saying 'email has been sent'. this is the code for calling the fuction Code: echo "<script language='javascript'>success();</script>"; I get the alert too. Code: function success(){
alert('E-Mail Sent Successfully');
window.close();
}
I even get the alert mentioning "E-Mail Sent Successfully". But simply the window is not closed. Can you guys please shed me some light on this.... Your help is greatly appreciated Ohh and by the way I'm running FF8. Cheers E Can anyone tell y the below code is not working in ie7 and ie8. working fine in ie6 window opened and gets closed immediately Very Urgent: <script language="javascript"> var perlwin; perlwin=window.open("' || Hse_Constants.strFileDownloadURL || 'download.pl?strSearchSeqID_=' || numSearchSEQ || '","tinywin","resizable=0,toolbar=0,menubar=0,status=1,width=775,height=500"); function closeWin() { timer = setTimeout("checkForOpener()", 10000); } function checkForOpener(){ try{ var myVar=window.opener.document; timer = setTimeout("checkForOpener()", 10000); }catch(e){ perlwin.close(); } } closeWin();</script>' I am trying to get the total of the checkboxes selected when the user clicks the "calculate total" button. It isn't working though. What am I doing wrong? Code: <html>
<head>
<script type="text/javascript">
function calculate(f)
{
var nums = f.num;
var ntext = f.numtext;
var nitem = f.numitem;
var result = 0;
var items = '';
for(var i=0;i<nums.length;i++)
{
if(nums[i].checked)
{
result+=parseFloat(ntext[i].value);
items+=nitem[i].value+'\n';
}
}
f.answer.value=result;
}
if (nums[i].checked) {
window.alert("Your total is " + f.answer.value=result;);
}
</script>
</head>
<body>
<style type="text/css">
.box1 { float:left;
width:500px;
clear:left;
}
.box2 { float:left;
padding-left:50px;
}
</style>
<form name="myform">
Build your own family meal<br>
<div class="box1">
<input type="checkbox" name="num" onclick="calculate(this.form)">
<input type="hidden" name="numtext" value="24.00" onchange="calculate(this.form)">
<input type="hidden" name="numitem" value="pencil" onchange="calculate(this.form)">
<div class="box2">Chicken Enchiladas $24.00</div>
</div><br>
<div class="box1">
<input type="checkbox" name="num" onclick="calculate(this.form)">
<input type="hidden" name="numtext" value="15.00" onchange="calculate(this.form)">
<input type="hidden" name="numitem" value="pen" onchange="calculate(this.form)">
<div class="box2">Rice and Beans $15.00</div>
</div><br>
<div class="box1">
<input type="checkbox" name="num" onclick="calculate(this.form)">
<input type="hidden" name="numtext" value="6.00" onchange="calculate(this.form)">
<input type="hidden" name="numitem" value="paper" onchange="calculate(this.form)">
<div class="box2">Chips and Salsa $6.00</div>
</div><br>
<div class="box1">
<input type="submit" name="answer" value="Calculate Total" onclick="calculate(f)" />
</div>
</form>
</body>
</html>
function MyPopUpWin(message) { var iMyWidth; var iMyHeight; //half the screen width minus half the new window width (plus 5 pixel borders). iMyWidth = (window.screen.width/2) - (75 + 10); //half the screen height minus half the new window height (plus title and status bars). iMyHeight = (window.screen.height/2) - (100 + 50); //Open the window. var generator = window.open(); generator.focus(); document.onmousedown = focusPopup; document.onkeyup = focusPopup; document.onmousemove = focusPopup; generator.document.write('<html><head><title>Pop uP</title>'); generator.document.write('<p style="color:#C52B27;">'); generator.document.write(message); generator.document.write('</p>'); generator.document.write('</head><body>'); generator.document.write('<a href="javascript:self.close()"><img src="/img/save_orange.gif" border=0"> <\/a>'); generator.document.write('</body></html>'); generator.document.close(); } function focusPopup(){ if(generator && !generator.closed) { generator.focus(); } } Hello, I have a bit of javascript that automatically loads Shadowbox on load. It works perfectly in Firefox, Chrome but NOT IE. If I put a standard link to open Shadowbox does work in IE, so it's not the shadowbox, it's definitely the window.onload bit which isn't working. Here is my code. Code: <link rel="stylesheet" type="text/css" href="shadowbox/shadowbox.css">
<script type="text/javascript" src="shadowbox/shadowbox.js"></script>
<!--this bit is for a link to open the Shadowbox from a link elsewhere on the page -->
<script type="text/javascript">
Shadowbox.init({players:['swf']});
</script>
<script type="text/javascript">
window.onload = function() {
Shadowbox.open({
content: 'flash/flash002.swf',
player: "swf",
title: 'Open Shadowbox',
width: 1200,
height: 800,
});
};
</script>
This DOES work though, so I know it's not the Shadowbox with the issue Code: <a href="flash/flash002.swf" rel="shadowbox;height=800px;width=1200px">Open Shadowbox</a> Really appreciate your help! Nicola Hello I have an onclick function used in my table which opens a new window on clicking the table element.. it works fine except that I seem unable to name the window being opened... Here is my function for opening the window: Code:
function LinkTo(page){
window.open ("http://www.xxx.com , "testpage" );
}
Any thoughts? Thanks Hi There, The following piece of code is working fine in IE6 but not in IE 8: if (Windowvar != null) { Windowvar.close(); } Windowvar= window.open(sUrl, 'static', viewerWinOption, true); To explain the functionality: 1. User clicks on one of the links on page 1 2. Clicking takes user from Page 1 to Page 2 (the transaction page). 3. Along with page 2, another page (Page 3) is opened. 4. User saves the transactions in the Page 2 and he is taken back to page 1 5. User clicks other link in Page 1 and activity in point 2 is repeated along with point 3 The issue is, when User clicks on the link AGAIN(for second transaction) in the Page 1 the Page 3 opens in the same browser window in the IE 6 but in IE 8 it opens in the differenct browser window (which shouldnt be happening) Any help will be appreciated. Regards, Sameer. Hi Guys, I have written a simple code to open up a new window onclick of a button as follows; Code: function loadExamp()
{
var reqType = getElementValue("reqType", 1);
window.open("../jsp/loadExamples.jsp?reqType=" + reqType, "Connection Test Utility - Message Examples", "width=500,height=300,menubar=no,status=yes, location=yes,toolbar=no,scrollbars=yes" );
return;
}
The problem is that this code is working on Google Chrome but not in Firefox and IE. Why is that and how can I resolve this issue. I am using Firefox 3.6.11 and IE 8.0.XX. Also I tried to open a new window using <a href> option with the same URL and its working but the only problem is that I want to pass my next JSP an argument which is only possible with function or script. I googled it but couldn't find much information except that there is some security problem. For that I have disabled the 'Pop up Bloker' on both Firefox and IE but still not working. When I click my button there is no activity with 'Firefox' but IE gives me error as follows; Code: Message: Invalid argument. Line: 74 Char: 2 Code: 0 URI: http://localhost:8080/T24Utility/scripts/verifyCxPool.js Please help, Thanks, -- Sjunejo Can someone please help with this code. The window is supposed to automatically scroll and move but it isn't working. (It was taken from a discontinued book called javascript in 24hrs) The javascript: Quote: var pos=100; function Scroll(){ if (!document.getElementById ) return; obj=document.getElementById("thetext"); pos -=1; if(pos < 0-obj.offsetHeight + 130) return; obj.style.top=pos; window.setTimeout("Scroll();", 30); } //start scrolling when the page loads window.onload=Scroll; the css: Quote: #thewindow{ position:relative; width:180px; height:150px; overflow:hidden; border:2px solid red; } #thetext{ position:absolute; width:170px; left:5px; top:100px; } the html: Quote: <!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>Untitled Document</title> <link rel="stylesheet" type="text/css" href="scroll.css" /> </head> <body> <h1> scrolling window example</h1> <p>This example shows a scrolling window created using javascript and the w3cdom.The red border window is actually a layer that shows a cliped portion of a larger layer"</p> <div id="thewindow"> <div id="thetext"> <p>This is the first paragraph of the scrolling message.The message is created with regular html</p> <p>Entries within the scrolling area can use any html tags.They can contain <a href="#">links</a></p> <p> No limit to the number of paragraphs that you can include here...</p> <ul> <li>For example you could format items using a bulleted list.</li> </ul> <p>The scrolling ends when the last part of tht scrolling text ids on the screen.You've reached the end.</p> </div> </div> </body> </html> I am using JavaScript for popups in my OpenLayers map. All the html tags like <br> work in the popup window except for the link href tag. Everytime I put in a link in my popup window it doesnt work: Code: var mystring = "here is link:<br> <a href=\"www.sun.com\">link</a>";
popup = New OpenLayers.Popup.FramedCloud("chck", feature.coord, null, mystring, null, true, onPopupClose);
Also tried link without quotes and with ticks and nothing seems to work with the link not taking me anywhere. Please advise. Hi, I've been searching for a good tut on modal boxs for a while where they open in middle of screen like facebook boxs & i want to have one where you use onClick function from href link. example: <a href="#" onclick="'files/delete.php?postId=$post['id']','modal_box'">Delete</a> and so on with other things. Can anyone help. Thanks. |
|||||||