Change parent window location from popup - html

I am trying to make some website and would like to ask some questions.
The main file for the website is main.asp.
In main.asp, I inserted notice.jpg file as a pop up window.
I would like to make that, if I click the pop up window, then the pop up window disappear and the new big window(www.charming.or.kr/jeju/) show up.
Can anyone help me on this?
The following is part of my source.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />
<title><!--#include file="../include/title.asp"--></title>
<style type="text/css">
#import url(../css/comm.css);
</style>
<script language='javascript'>
function OpenWin(dest)
{
posy = screen.Height/2 - 100;
posx = screen.Width /2 - 200;
StartWin = window.open(dest,
"notice_popup","toolbar=no,channelmode=no,left="+posx+",top="+posy+",location=no,directories=no,w idth=743,height=720,resizable=no,menubar=no,scroll=no");
}
</script>
</head>
<body onload="OpenWin('../img/main/Notice.jpg')" >

In your new window you can refer to your original window by using window.opener which is a direct reference to your original. You can thus use
window.opener.location.href = newURL;

Related

canvas not visible on the browser(using atom text editor)

I've just setup atom and installed p5.js packages.
it is running but canvas is not visible.
sketch.js
function setup() {
createcanvas(200,200)
canvas.style("visibility", "visible")
// put setup code here
}
function draw() {
// put drawing code here
background(0);
rect(100,100,50,50);
}
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>p5.js example</title>
<style>
body {
padding: 0;
margin: 0;
}
</style>
<script src="libraries/p5.js"></script>
<script src="libraries/p5.sound.js"></script>
<script src="sketch.js"></script>
</head>
<body>
</body>
</html>
on running it using atom editor the canvas is not visible on the browser screen
You have to capitalize the second c in createCanvas(width, height);
You can't use canvas.style("visibility", "visible"), so remove that line
3.For future reference, inspect the page and look at the console, I found both of these things from errors.
function setup() {
createcanvas(200,200)//on this line, capitalize the c in canvas
canvas.style("visibility", "visible")//remove this line
// put setup code here
}
Your html is all correct
#Hgbanana is correct. I thinks it would be better if you put your library scripts in the head tag to make sure the libraries load before the page. But it should work anyways.

HTML a href with target set to "_blank" without moving to the opened page

I would want to create an tag with target attribute set to blank, but without actually moving me to the opened page, but rather staying on the page it was opened on.
I hope this helps.
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<style></style>
</head>
<body>
<a href="https://google.com/" trueblank="true" >Click Me</a>
<script>
var links = document.querySelectorAll("a");
links.forEach(function(each) {
each.onclick = function(ev) {
if(this.getAttribute("trueblank") == "true") {
ev.preventDefault();
window.open(this.href);
}
}
});
</script>
</body>
</html>
following JS code below opens a new window on your current window and user remains on the first page yet
window.open("https://www.w3schools.com", "_blank", "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=400,height=400");

UIWebView error message (Unable to Read Document) doesn't fit available space

I display different files onto a webview. Now I had the case were a file was corrupted. In this case the following error is displayed:
Unable to Read Document
An error occurred while reading the document
The content of the webview is
<html>
<head>
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.6">
<style type="text/css">
div {
font-family: Arial;
font-size: 18;
}
</style>
</head>
<body>
<div align="center">
<br><b>Unable to Read Document.</b>
</div>
<br>
<div align="center">An error occurred while reading the document.</div>
</body>
</html>
Now I have this webview on an iPad not taking up the full screen. The content still wants to take up the whole screen width, but the webview size is smaller. I'm already using scalesPageToFit, which is set to YES.
What do I have to do to get the error message taking up the available space? Can you perhaps adapt the meta tag? But here you still would have a flicker effect ...
I used the stringByEvaluatingJavaScriptFromString method and changed the viewport width with the help of Javascript:
[webView stringByEvaluatingJavaScriptFromString:#"viewport = document.querySelector('meta[name=viewport]'); viewport.setAttribute('content', 'width=320');"]
You can place this code in webView:didFailLoadWithError: delegate method.
The C# version does look like this:
webView.LoadError += (object sender, UIWebErrorArgs e) => {
webView.EvaluateJavascript("viewport = document.querySelector('meta[name=viewport]'); viewport.setAttribute('content', 'width=320');");
// do something else ...
}

How can I refresh an image without repaint flicker?

Okay I am going to be outright. I have never touched HTML ever and may be a nuisance. But I understand lua and simple principles of coding. With that said I will get on with my question.
I made a status checker for my minecraft server and used the image to make a desktop gadget I want the flicker to stop when it refreshes. I used other sources and applied them.
<html>
<head>
<title>War Server</title>
<style>
body{width:560;height:95}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
//<![CDATA[
window.onload = function() {
img = document.getElementById('refreshImage');
img.src += "?";
setInterval("img.src=img.src.replace(/\\?[0-9]*/, '?'+Math.floor(Math.random()*9999999+1));", 5000);
}
//]]>
</script>
</head>
<body>
<img id="refreshImage" src="Status.png" alt="Server Banner" style="position:absolute;top:0;left:0;border:0;width:560px;height:95" />
</body> <!--I didn't put the actual link for privacy.-->
</html>
My Idea:
There probably is a proper way but I'd like to think I could contribute something. I thought I might be able to have a background of the same image but it updates just before the image. Thus the background would change and then the image would paint and the background would flash(That was what the flicker always was) but it would matter because when it'd had change and flashed the image would've covered it.
The proper solution would not be with html or css it would be with javascript/jquery since you are already using it. You would need to use an if and else statement.
if(i==1) {
return; //stop the execution of function
}
else {
//keep on going
}
I could provide further advice but you need you clarify your question better. Do you want the picture to flicker until the page is done loading? You used the word update what is it you are waiting for to update?If you are then.
if (document.readyState === "complete") would be your argument so...
<html>
<head>
<title>War Server</title>
<style>
body{width:560;height:95}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
//<![CDATA[
img = document.getElementById('refreshImage');
if (document.readyState === "complete") {
img.src = "Status.png";
return; //stop the execution of function
}
else {
//keep on going
img.src += "?";
setInterval("img.src=img.src.replace(/\\?[0-9]*/, '?'+Math.floor(Math.random()*9999999+1));", 5000);
}
//]]>
</script>
</head>
<body>
<img id="refreshImage" src="Status.png" alt="Server Banner" style="position:absolute;top:0;left:0;border:0;width:560px;height:95" />
</body> <!--I didn't put the actual link for privacy.-->
</html>

HTML: Meta tag not refreshing the image

I use the following html5 code to display a html page with an image(1.JPG). Its working fine. The image will be randomly overwritten with an another newer image in a certain interval in the same path provided. So, I use meta tag to refresh the page, so that whenever any newer image is overwritten in the path, the page will be refreshed with the updated image automatically. But, it looks like refreshing the page for every 5 secs fine, but its NOT displaying the newer image which has overwritten in the same path, it always shows with the initial image i kept. Could someone help me to fix this issue?
<!DOCTYPE HTML>
<html>
<head>
<style>
body {
margin: 0px;
padding: 0px;
}
</style>
<meta http-equiv="refresh" content="5">
</head>
<body>
<canvas id="myCanvas" width="578" height="100"></canvas>
<script>
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
context.font = 'italic 30pt Calibri';
context.fillText('Screen sharing', 10, 50);
</script>
<p><img src = "file:////Users/Martin/Downloads/1.JPG" /> </p>
</body>
</html>
Meta tag Refresh URL, please try
<meta http-equiv="refresh" content="5; ,URL=http://domain.com">
OR You can do it from javascript
<script type="text/javascript">
setInterval(function(){
window.location.reload();
},5000);
</script>
And please use SERVER url to load image instead of file url
<p><img src = "file:////Users/Martin/Downloads/1.JPG" /> </p>
Change To
<p><img src = "http://domain.com/Downloads/1.JPG" /> </p>