Hiding div with cookies after a second visit user - javascript

Hello friends have tried hard and not found how do I thank for the help now.
I want to hide a div with cookies after a second visit of the user that is when the User visit the page div appears later when the User leave the page and return the div does not appear.
Here my code:
jQuery(document).mousemove(function(e){
if( document.activeElement && document.activeElement.tagName == 'IFRAME' ){
jQuery.post(window.location.href, {click: 1});
document.getElementById('mime').remove();
}
});
jQuery(document).bind("contextmenu",function(e){jQuery("#mime").remove();});
document.onkeypress = function (event) {
event = (event || window.event);
if (event.keyCode == 123) {
jQuery("#mime").hide();
return false;
}
}
document.onmousedown = function (event) {
event = (event || window.event);
if (event.keyCode == 123) {
jQuery("#mime").hide();
return false;
}
}
document.onkeydown = function (event) {
event = (event || window.event);
if (event.keyCode == 123) {
jQuery("#mime").hide();
return false;
}
}
<div id="mime" style="position:absolute; z-index:99999999999999; opacity:0.0; filter: alpha(opacity=0) ">
<script type='text/javascript'>
habilita=true;
if(document.all){}
else document.captureEvents(Event.MOUSEMOVE);document.onmousemove=mouse;function mouse(e)
{if(navigator.appName="Netscape"){xcurs=e.pageX;ycurs=e.pageY;}else{xcurs=event.clientX;ycurs=event.clientY;}
if(habilita){ document.getElementById("mime").style.left=(xcurs-230)+"px";document.getElementById("mime").style.top=(ycurs-150)+"px";}}
</script>
</div>

You can use js-cookie
Show modal only if modalShown value is undefined
if (!Cookies.get('modalShown')) {
// show modal
}
Save to cookies when user visits a page
Cookies.set('modalShown', true);

Related

using JavaScript how to disable the Right-click or how to remove the inspect element option in the right-click window when click on the scroll bar

I am trying to disable right-click action on the scroll bar or remove the Inspect element option in the right-click menu window on my page. I am using the below code to fulfill my requirement. but where it is getting an issue that I am not able to find and other solution also not coming into mind. Please find my sample code below. Please Any help appreciated.
Sample Application - Using this link you can check the code.
<html oncontextmenu="return false;">
<head>
<style>
</style>
<script >
document.onkeypress = function (event) {
event = (event || window.event);
return keyFunction(event);
}
document.onmousedown = function (event) {
event = (event || window.event);
return keyFunction(event);
}
document.onkeydown = function (event) {
event = (event || window.event);
return keyFunction(event);
}
//Disable right click script
var message="Sorry, right-click has been disabled";
function clickIE() {if (document.all) {(message);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {(message);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
document.oncontextmenu=new Function("return false")
function keyFunction(event){
//"F12" key
if (event.keyCode == 123) {
return false;
}
if (event.ctrlKey && event.shiftKey && event.keyCode == 73) {
return false;
}
//"J" key
if (event.ctrlKey && event.shiftKey && event.keyCode == 74) {
return false;
}
//"S" key
if (event.keyCode == 83) {
return false;
}
//"U" key
if (event.ctrlKey && event.keyCode == 85) {
return false;
}
//F5
if (event.keyCode == 116) {
return false;
}
}
</script>
</head>
<body >
<iframe style="width:100%" height="473" src="https://africau.edu/images/default/sample.pdf#toolbar=0"></iframe>
<div style="width:96%;height:473px;background-color:transparent;position:absolute;top:0px;max-width: 100%;">
</body>
</html>
The right click default behavior is to fire a contextmenu event whose default behavior is to display the context menu.
In order to prevent that default behavior, write this:
document.addEventListener('contextmenu', e => e.preventDefault());
Note that it won't prevent people from accessing developer tools with F12 and there is nothing you can do about this.

How can I disable the key in second time press same in jQuery?

When press first time 37 it showing alert message, again press the same key second time I want to disable that key. How can do that?
$(document).on (‘keydown’ , function (e){
var userVal = e.which ∥ e.keycode
valadation (userVal)
})
function valadation (userVal){
if (37 == userVal){
alert (“Wecome”)
}
}
Create a variable and update its value.
let clickVar = 0
$(document).on('keydown', function(e) {
var userVal = e.which || e.keycode
valadation(userVal)
})
function valadation(userVal) {
if (37 === userVal && clickVar === 0) {
alert('Welcome');
clickVar++
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
//name the handler
$(document.body).on('keydown', function alertOnEnter (e) {
if ([e.keyCode, e.which].indexOf(13) > -1) {
//remove the handler from the event
$(document.body).off('keydown', alertOnEnter);
alert('you hit enter');
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

How to Manage This Enter Key Event with three Different Situation

In my aspx page, I am also using two Modal Extender but the main problem is that when modal popup extender comes in front then still search button click I want that modal popups button should click on enter key when popup is shown.
I have set Default Enter Key Event in my page like this:
$(document).ready(function () {
$("body").bind("keydown", function (event) {
var keycode = (event.keyCode ? event.keyCode : (event.which ? event.which : event.charCode));
if (keycode == 13) {
document.getElementById('btnSearch').click();
return false;
} else {
return true;
}
});
and it's working good.
But the problem is that I have also two ModalPopupExtender on my Page
with Id = ModalPopupExtender1 and Id = ModalPopupExtender2.
Now I want when My ModalPopupExtender1 called then button with ID = "btnMUpdate" should click on enter key.
and when my ModalPopupExtender2 called then
button with ID = "btnConfirm" should click on enter key.
$(document).ready(function () {
this.ModalPopupExtender1.add_showing(show1);
this.ModalPopupExtender2.add_showing(show2);
this.ModalPopupExtender1.add_hiding(hide1);
this.ModalPopupExtender2.add_hiding(hide2);
$("body").bind("keydown", function (event) {
var keycode = (event.keyCode ? event.keyCode : (event.which ? event.which : event.charCode));
if (keycode == 13) {
if (this.ModalPopupExtender1IsShown) {
document.getElementById('btnMUpdate').click();
} else if (this.ModalPopupExtender2IsShown) {
document.getElementById('btnConfirm').click();
} else {
document.getElementById('btnSearch').click();
}
return false;
} else {
return true;
}
});
function show1() {
this.ModalPopupExtender1IsShown = true;
}
function show2() {
this.ModalPopupExtender2IsShown = true;
}
function hide1() {
this.ModalPopupExtender1IsShown = false;
}
function hide2() {
this.ModalPopupExtender2IsShown = false;
}
On each ModalPopupExtender you can put a callback on show and hide events
i come across this and that worked fine for me
<ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender3" runat="server"
PopupControlID="PanelMsg" TargetControlID="lnkdummy3" BackgroundCssClass="modalBackground" >
</ajaxToolkit:ModalPopupExtender>
<asp:Panel ID="PanelMsg" DefaultButton="btnMSend" runat="server" Style="display: none;background-color:#e0e0e0">
</asp:Panel>
given modal extender panel DefaultButton="btnMSend" and that worked fine

fire a button with pressing ENTER after coming with TAB to it

there is a button in my code. Apart from using mouse and clicking it, I'd like to fire (pressing ENTER) it after selecting it with TAB.
<div id="CloseButton" tabindex="0" onkeypress="return submitOnEnter(blah,event)">Close</div>
if it helps:
function submitOnEnter(blah,e) {
var keycode;
if (window.event) keycode = window.event.keyCode;
else if (e) keycode = e.which;
else return true;
if (keycode == 13) {
//at this point I need to fire a button w/o using its id
return false;
} else {
return true;
}
}
If someone knows how to do it?
Is it possible to make 'blah' refer to <div>, such that I could do:
$(blah).click();
this could work:
jQuery(':focus').click()
here is my solution:
part of HTML, close button is a div element and is a part of a modal window:
...
<div class="closeButton">
<span id="closeSpan" tabindex="0">Close</span>
</div>
...
JS, within the ModalWindow class:
$(modWin).find("#closeButton").one("click",
this.close).keypress(this.doNothing);
this.close = function () {
$("#modalWindow").css("display","none").fadeOut(200).html("");
$("#modalWindow #closeButton").hide();
$(window.self.document.body).find("#modalWindow").remove();
}
this.doNothing = function (e) {
var keycode;
if (window.event) keycode = window.event.keyCode;
else if (e) keycode = e.which;
else return true;
if (keycode == 13) {
innerthis.close();
return false;
} else {
return true;
}
}
PS: innerthis is defined within the ModalWindow class as:
var innerthis = this;

Keyup Event Not Triggered When iFrame in Focus

Let me start by saying I have no control over the iframe.
Like "stumbling" I let the user navigate to the next page by using the right arrow key.
The problem is that if the user has clicked anywhere inside of the iframe window, the keyup event on the containing document is ignored.
<script type="text/javascript">
$(document).ready(function() {
$(document).on('keyup', null, function(event) {
var stumblenext = $('#stumblenext');
if (event.keyCode == 39) { top.location=stumblenext.attr('href'); }
if (event.keyCode == 37) { history.back(); }
});
});
</script>
When you detect that the focus is on the iframe change the focus to some other element on your page.
Script :
function changeFocus() {
if (document.activeElement == document.getElementsByTagName("iframe")[0]) {
document.getElementById("YOUR_ID").focus();
}
}
window.setInterval(changeFocus, 1000); // Set time accordingly
Try binding keyup on the iframe as well.
$(document, $("#idOfiFrame").contents()).on('keyup', null, function(event) {
var stumblenext = $('#stumblenext');
if (event.keyCode == 39) { top.location=stumblenext.attr('href'); }
if (event.keyCode == 37) { history.back(); }
});

Categories

Resources