Displaying the Popup box generated by Greybox on page load(onLoad) - javascript

I have the following html code :
Launch
It launches a popup generated with GREYBOX when I click on LAUNCH. but now I want this to happen automatically every time the website is opened! How do I do that?

<body>
<script>
AJS.AEV(window, 'load', function() {
GB_show("Hello world", "http://google.com");
});
</script>
The AJS library used by greybox offers it's own pageload call

Related

How to automatically click log in button using JavaScript

I want to save some JavaScript code as a bookmark in chrome so it automatically opens my university login site and clicks on on the login button. I am completely inexperienced in JavaScript, so I have no clue how to do this. I snipped together the following code, which opens the correct website, but then does not click on anything. The first URL automatically puts me to the login site (third URL in the code) in case I have not logged in yet in this window.
(function() {
window.location.replace("https://lms.uzh.ch/auth/MyCoursesSite/0");
window.onload = function(){
if (current_url.startswith('https://lms.uzh.ch/auth/MyCoursesSite/0')) {
return;
}
if (current_url.startsWith('https://lms.uzh.ch/dmz/')) {
document.getElementById("wayf_submit_button").click();
}
};
})();
I'm sorry if this is too obvious a question and annoys any experts but as I said I am a complete beginner. I would of course add the "javascript:" at the beginning for chrome to understand the bookmark.
When you use window.location.replace, you change the address and you code can't work anymore.
I can suggest using some browser extension, your "click function" should work then.
I guess you could also try to make some simple html page with iframe, you call your "click function" at this page, but you target it to the iframe. After that you can change browser's location to the university's webpage as you should already be logged in.
<html>
<head>
</head>
<body>
<iframe src="your_university_address.com" id="some_id" onload="click_button()"></iframe>
<script>
function click_button()
{
my_iframe=document.getElementById('some_id');
my_iframe.contentDocument.getElementById('your_button_id').click();
}
</script>
</body>
</html>
Very simple but it should do that job.
(You can achieve similar result by using window.open() I guess)

How to create onPageLoad box so that a user can click an image which open a link in new tab?

I have an ASP.NET website and it's needed when user loads site homepage, a box pops up on page load (not a popup) with an image appear. When user clicks the image, it opens a link in a new tab?
I guess jQuery can do this or AJAX. I'm a noob in this! Hope you provide me with a sample functional code.
You could do something like this. The code below creates an image on document ready and binds a click event to it which when clicked, will open a new tab.
<script>
$(document).ready(function(){
var image = $('<img></img>').attr('id', 'my_image').attr('src', '/path/to/your/image.png')
$('#container').append(image);
$('#my_image').click(function(){
var window = window.open('http://your_url/', '_blank');
window.focus();
});
});
</script>

Don't reload the popup in a chrome extension

I'm building a chrome extension and every time the user click on the icon the popup.html page is loaded(reloaded). Is there a way to load the popup page only the first time, or to load it in the background?
Here is the code from my background script
var x=false;
chrome.browserAction.onClicked.addListener(function(tab) {
if(x==false){
alert("test");
chrome.browserAction.setPopup({popup: "popup.html"});
}
});
So the alert("text") is triggered only one time, but the popup.html is changed every time I click the icon. In popup.html I simply generate a different random number.
document.addEventListener('DOMContentLoaded', function () {
document.getElementById("test").innerHTML=Math.random();
});
Thanks
Everytime a users clicks the browserAction button chrome will open or close the attached popup. There is no way to stop it.

jQuery Mobile popup on page load with Rails

I am trying to open a popup on page load using jQuery Mobile and Rails.
The popup can be opened with a link, but I can't make it open on load.
HTML code
<div data-role="popup" id="popup-choix" data-history="false" data-overlay-theme="a" data-transition="flow" data-position-to="window">
<ul>...</ul>
</div>
Javascript code
$(document).on("pageshow", function() {
$('#popup-choix').popup('open');
});
I checked with Chrome and the Javascript is correctly linked to the page.
I have a link on the page to open the popup. It works perfectly.
<div class="div-popup">...</div>
I guess the problem is with my Javascript then...
UPDATE
I placed the Javascript in popup.js, which is then called with the application.js manifest.
UPDATE 2
I wrote the javascript in popup.js and call it with the manifest.
Updated
Note: for Ruby on Rails users read this comment.
This is the correct way to open a popup, once page loads/shows.
$(document).on("pageshow", function() {
$('#popup-choix').popup('open');
});
In some browsers, popup doesn't show once the page loads, therefore, adding timeout to open the popup is essential.
Source
$(document).on("pageshow", function() {
setTimeout(function () {
$('#popup-choix').popup('open');
}, 100); // delay above zero
});
If you want to open for a specific page, add '#PageId' instead of document.

Printing a web page using just url and without opening new window?

<html>
<head>
<script type="text/javascript">
var URL = "http://localhost:8000/foobar/";
var W = window.open(URL); **Note1**
W.window.print();
</script>
</head>
<p> Print ME...............</p>
</html>
I am using this script to print a webpage.
My views render this page and The JS take care all other things.
But I dont want to open new window for that. So, What should I use instead of window.open(URL) so no new window opens. Similarly, I don't want to open new window for print function.So, Whenever I render this page it do all stuff on the same page. No new window, No new tab. How can I achieve this. I google but nothing seems working.
You can do this using a hidden iFrame (I'm using jquery for the example):
function loadOtherPage() {
$("<iframe>") // create a new iframe element
.hide() // make it invisible
.attr("src", "/url/to/page/to/print") // point the iframe to the page you want to print
.appendTo("body"); // add iframe to the DOM to cause it to load the page
}
This will load the page you want to print. To print, you can add javascript code to the print page so that it gets printed after loading:
$(document).ready(function () {
window.print();
});
This will print the page without showing a new window. I've tested this in IE8,9 and Google Chrome, so I'm not sure if this works for Safari or Firefox, though.
There's a nice example on MDN how to do that with a hidden iframe https://developer.mozilla.org/en-US/docs/Printing#Print_an_external_page_without_opening_it
In reference to #andragon's answer. updated on top of it.
You can do this using an iFrame(Not hidden because hidden iFrame prints the blank page in latest versions of browsers. You can hide after the print is triggered)
function loadOtherPage(link) {
$("<iframe class='printpage'>") // create a new iframe element
.attr("src", link) // point the iframe to the page link you want to print
.appendTo("body");
}
This will load the page link you want to print.
On loading the print page link you can call javascript.
$(document).ready(function () {
window.print();
});
window.onafterprint = function () {
$('.printpage', window.parent.document).hide();
}
This will print the page from the same window and onafterprint Event is triggered when a page has started printing, or if the print dialog box has been closed
window.parent.document is to hide the iFrame block on the parent page.
I'm using Asp .net core with razor html as view, in this case I have used window.print() to print the page then used window.onafterprint to back to the page where used want to be redirected.
You can use ViewBag to replace the "/NewSales" URL.
NOTE: window.onafterprint will be called whenever user clicks Cancel/Submit/Print button in that pop-up.
$(document).ready(function () {
window.print();
window.onafterprint = function () {
window.location.href = "/NewSales";
}
});
function CallPrint() {
var prtContent = document.getElementById('main');
var WinPrint = window.open('', '', 'width=800,height=650,scrollbars=1,menuBar=1');
var str = prtContent.innerHTML;
WinPrint.document.write(str);
WinPrint.document.close();
WinPrint.focus();
}
Call this javascript function on Print button click."main" is the id of the div which we have to print without opening into new window.I want to notify that this will print the current page div.
Try and rever in case of any issue.
Thanks,
Gourav

Categories