I'm using the following code in order to check when the user clicks a (cross-domain) iframe:
var myConfObj = {
iframeMouseOver : false
}
window.addEventListener('blur',function(){
if(myConfObj.iframeMouseOver){
console.log('Wow! Iframe Click!');
}
});
document.getElementById('YOUR_CONTAINER_ID').addEventListener('mouseover',function(){
myConfObj.iframeMouseOver = true;
});
document.getElementById('YOUR_CONTAINER_ID').addEventListener('mouseout',function(){
myConfObj.iframeMouseOver = false;
});
I'm using this to check if a user clicked a Google Ad, and it works fine the first time you click it. However the second click on the banner doesn't get registered (unless you refresh the page again).
What I've noticed, though, is that if I click anywhere OUTSIDE the iframe after the first click, and then I click the banner again, the click gets registered.
What I tried to do was use 'window.focus();' on mouseover, but it doesn't fix it.
Can you help me?
Related
I am having alot of trouble trying to fix this issue with this HTML template Click Here . Please scroll to the 1st template Demo under Shop Pages as shown in the image below.
(Please resize your browser to a mobile screen size)
When the user opens the mobile dropdown menu on the left, he should be able to close it by clicking outside of the menu, like by clicking anywhere else on the body of the page. Currently this only closes when the user clicks on the hamburger icon.
Also, currently if the user has the menu open and then he clicks on the body of the page and then goes back to click the hamburger icon because clicking the page did not work, the page freezes up and you are unable to scroll unless you tap the screen a bunch of times because that vertical scroll bar comes in and it has the focus I guess (creating a bad experience for mobile users).
I have tried to fix this with the following code I wrote, but once the menu slides back up it never comes back down as if it was deleted from the page:
<script>
$(document).on("click", function (event) {
var $trigger = $(".mobile-menu.hamburger-icon");
if ($trigger !== event.target && !$trigger.has(event.target).length){
//THIS IS WHAT WORKS BUT YOU HAVE TO CLICK OUTSIDE LIKE TWICE FOR IT TO COME BACK
$(".mobile-navigation.dl-menuwrapper").slideUp("fast");
}
});
</script>
I have also tried to add this piece of code to the page as well so that the menu can reappear if the user clicks on the hamburger icon again but it makes the page buggy because the menu will only come down once and then disappear again if you click on the body again while trying to close it.
<script>
$(document).on("click", function (event) {
var $trigger = $(".mobile-menu.hamburger-icon");
if ($trigger !== event.target && !$trigger.has(event.target).length){
//THIS IS WHAT WORKS BUT YOU HAVE TO CLICK OUTSIDE LIKE TWICE FOR IT TO COME BACK
$(".mobile-navigation.dl-menuwrapper").slideUp("fast");
}
});
</script>
<script>
$(".mobile-menu.hamburger-icon").on("click", function (event) {
$(".mobile-navigation.dl-menuwrapper").slideDown("fast");
});
</script>
How can I get this to work the way I need it to ?
Thank you!
I was able to somewhat fix this by adding some custom classes to the div for the icon button and by writing this snippet of code which seemed to do the trick for me.
<script>
$(document).on("click", function (event) {
var $BMI = $(".mobile-menu.hamburger-icon");
var $VMM = $(".dl-menu.dl-menuopen");
if ($BMI !== event.target && !$BMI.has(event.target).length && ($VMM.is(":hidden"))) {
$(".mobile-navigation.dl-menuwrapper.open-mobile-menu").addClass('open-mobile-menu');
$(".dl-menu.dl-menuopen").addClass('dl-menuopen');
}
</script>
I am facing some challenge-
Lets consider I have a menu and under that I have 3 links-
About
Contact Us
FAQs
By default home page is About menu item.
Now when I am clicking on "Contact Us" , I want to open a new tab on same browser window. And without closing this if again I am clinking on "Contact Us" from the first tab, this time I do not want to open new tab because I have already an open tab for Contact us, I just wanted to navigate to the same one which is earlier opened.
How to handle this scenario in jsp.
Is there any way to do this. please help me.
you can always put a name in the target so it will always go to the same window/tab
<a href="somerandomurl.com" target="mywindow">Contact Us<\a>
Its not possible to control this on Internet explorer.
You can however change how IE behaves:
-Internet Options
-Tabs
-Always open pop-ups in a new tab
-Open links from other programs in: A new tab in the current window
target="_blank" will always make sure it opens in a new window
http://www.w3schools.com/tags/att_a_target.asp
It will however refresh the page with the same url
You can have the link return a javascript window object and be able to return to the window anytime you want without refreshing the page
var newtab = null;
function openwindow(){
if (newtab==null) {
newtab = window.open("www.example.com");
} else {
newtab.focus();
}
}
<a onclick="openwindow()">click me</a>
This solution will work if someone refresh the parent page also, it will close the child tab if that tab is already open on refresh of parent page.
Javascript:
<script>
var newtab = null;
window.open('', 'business-list', '').close();
function openwindow() {
if (!newtab || newtab.closed) {
newtab = window.open("/admin/business-list.aspx","business-list");
} else {
newtab.focus();
}
}
</script>
HTML:
<a onclick="openwindow()" style="cursor:pointer">Business List</a>
I made an html page for my photos.
When clicking on some area, a lightbox sort of feature appears. So basically a part of the page which is not visible up to then comes in the middle of the screen.
I have a close button to get rid of it if someone wants, as well as the esc button.
However, and especially on phones, everyone clicks the phone back button. So I a trying to assign to the back button an event, that instead of "go back to the previous page" just "get rid of the lightbox".
Is that possible?
Many thanks,
Elias
A bit clumsy but...
window.onbeforeunload = function() {
if (LiteBoxOpen) {
var r = confirm("Do you wish to leave the page? Press no to just close image");
if (r == true) {
return true;
}
closeLiteBox(); // what ever is the function to close your litebox
return false;
}
} };
Since you don't want to delete the users history, most users hate that. But you could.
i would like to disable a user from right mouse clicking on an embedded youtube video.
How to I do this ?
1st Way:
We can set the oncontextmenu="return false" in the tags of the HTML page where you have embedded youtube video
so HTML part will probably look like
<{tagname} oncontextmenu="return false">
...
</{tagname}>
2nd Way:
In this way we add a JavaScript method, in this we check if click is right click or left click if it is right click then a message is displayed like "Right click disabled".
Set an id where you have added code for embedded youtube video. Add this Script in the HTML Document for that id.
<script language="javascript">
document.getElementByID({idname}).onmousedown=disableclick;
status="Right Click Disabled";
Function disableclick(e)
{
if(event.button==2)
{
alert(status);
return false;
}
}
</script>
Note: In this solution if you click the right click it displays the message:
“Right click disabled”
If we want to remove the message box then this solution do not work.
*Replace {...} with appropriate names.
Reference: Click here
I want users to input some url in a text field from a popup, and then, when submit the popup the parent page auto refresh and shows the url they have insert, with hyperlink to the site.
I have now set a scrypt to store the form in a cookie, that computer can read everytime users come back to the site.
You can see my work in: http://www.resmasecamadas.com/test
You can achieve it using JS. you dont need to use cookies at all!
Observe this sample code.
//On click of this button new Popup will be opened!
<button onclick="myFunction();">Open popup</button>
<script>
function myFunction() {
var popup = window.open("", "popup", "width=200, height=100");
popup.document.write("<input type='text' name='text' id='text'><button onclick='window.opener.passFunction(text.value);'>click</button>");
}
function passFunction(x){
document.write(x);
}
</script>
You can send data from pop up window using window.opener.someFunction(parameters)here "someFunction" is a function in parent window!