javascript hide/show functionality doesn't work in Firefox - javascript

Some of the javascripts on this site: http://www.bristolhotel.com/pizzeria/onlinepizza3.php doesn't work in Firefox. What's the problem?
<script language="JavaScript">
function OpenDiv(popUpDiv){
popUpDiv.style.display="block";
window.setTimeout("Hide();", 2000);
}
function OpenDiv(blanket){
blanket.style.display="block";
window.setTimeout("Hide();", 2000);
}
function Hide() {
document.getElementById('popUpDiv').style.display='none'
document.getElementById('blanket').style.display='none'
}
</script>
<script language="JavaScript">
function OpenCloseDiv(divName) {
if (divName.style.display == "none") {
divName.style.display="block";
} else {
divName.style.display="none";
}
}
</script>

The code you provided isn't actually the problem.
If you look at the error console (I'm assuming you didn't), you'll see errors like "nr11 not defined". And this is why :
<a onclick="OpenCloseDiv(nr11)"
I don't know where you have the variable nr11 defined, but you'll probably want to make it a string: "nr11" instead.

try to change window.setTimeout("Hide();", 2000); to window.setTimeout(Hide, 2000);

I changed the code to this:
<script type="text/javascript">
function OpenCloseDiv(divName){
var div = document.getElementById(divName);
if (div.style.display == "none") {
div.style.display="block";
}
else {
div.style.display="none";
}
}
</script>
<script type="text/javascript">
function OpenDiv(popUpDiv){
var div = document.getElementById(popUpDiv);
div.style.display="block";
window.setTimeout("Hide();", 2000);
}
function OpenDiv(blanket){
var div = document.getElementById(blanket);
div.style.display="block";
window.setTimeout("Hide();", 2000);
}
function Hide()
{
document.getElementById('popUpDiv').style.display='none'
document.getElementById('blanket').style.display='none'
}
</script>
and then added "" ( ) and it seems to work now. :)
Thank you for all your help! Really appreciate it!

Related

JavaScript - setInterval not doing anything

I have code (like always) but the setInterval in my code is not working. Any clue why? My code:
setInterval(function(){
if ($("*:contains(':\\)')").length > 0) {
replace();
};
}, 300);
$("*:contains(':\\)')").length > 0 reports true just to let you know :)
Tell me if you need more details. Thank you!
Woohoo! I fixed it using the following code (based on Arun Sivan's solution):
var head = document.getElementsByTagName('head')[0];
var link = document.createElement('script');
link.src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js';
head.appendChild(link);
$(document).ready(function(){
function replace() {
// Lot's of code
}
replace();
function check() {
if ($("*:contains(':\\)')").length > 0) {
replace();
};
}
setInterval(check, 300);
}
This is a simple setInterval function. if this does'nt solve your problem please try to share a JSFiddle.
$(document).ready(function(){
setInterval(function(){$('.myTail').append("="); }, 500);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="myTail"> -:(my tail is growing)===</div>

How to get a blinking link on Blogger

The JavaScript below causes some text to blink on a web page. When I use it with an anchor tag on Blogger it only acts like a link and does not blink. If it is not an anchor tag it will blink. Is there any way to get around this on Blogger?
<html>
<head>
<script type="text/javascript">
function blinker()
{
if(document.getElementById("blink"))
{
var d = document.getElementById("blink") ;
d.style.color= (d.style.color=='red'?'white':'red');
setTimeout('blinker()', 500);
}
}
</script>
</head>
<body onload="blinker();">
<div id="blink">GOOGLE</div>
</body>
</html>
function blinker() {
if (document.getElementById("blink")) {
var d = document.getElementById("blink");
d.style.color = (d.style.color == 'red' ? 'white' : 'red');
setTimeout('blinker()', 500);
}
}
blinker();
GOOGLE
<div id="blink">GOOGLE</div>
<script type="text/javascript"> function blinker() {
if(document.getElementById("blink"))
{
var d = document.getElementById("blink") ;
d.style.color= (d.style.color=='red'?'white':'red');
setTimeout('blinker()', 500);
} } </script>
<body onload="blinker();">
<div id="blink"> GOOGLE</div> </body>
Basically, you need to add an href element.
Finally found answer myself
<script type="text/javascript">
function blinker()
{
if(document.getElementById("blink"))
{
var d = document.getElementById("blink") ;
d.style.color= (d.style.color=='red'?'white':'red');
setTimeout('blinker()', 500);
}
}
</script>
<body onload="blinker();">
<div id="blink">GOOGLE</div>
</body>
Thanks everybody for helping
Maybe try this. It uses JavaScript to treat the div a link. Looks like StackOverflow blocks that though, which is understandable. It should still work for you on other pages. Note however that the user won't see what's on the other side if they hover their mouse over it, and the cursor won't change to indicate it is clickable.
function blinker() {
if (document.getElementById("blink")) {
var d = document.getElementById("blink");
d.style.color = (d.style.color == 'red' ? 'white' : 'red');
setTimeout('blinker()', 500);
}
}
function goto(page) {
document.location = page;
}
blinker();
<div onclick="goto('https://www.google.com/')" id="blink">GOOGLE</div>

Refresh javascript if else statment not working

hi everyone I am new to Javascript and would like to know how would I refresh an if else statement in javascript every 5 seconds, i have looked and cannot get anything to work thanks in advance.
<script type="text/javascript">
if(total == randnum) {
document.write('Correct');
} else {
document.write('Incorrect');
}
</script>
Do you need to write out the document or can you display the text in some element like a div?
If so then you can try something similar to what 'chopper' suggested:
Assuming you have a div in your page with the id "myDiv"
<div id="myDiv"></div>
Then use this to write out your text:
var myDiv = document.getElementById("myDiv");
setInterval(function () {
if(total == randnum) {
myDiv.innerHTML = "Correct";
} else {
myDiv.innerHTML = "Incorrect";
}
}, 5000);
Wrap the code you want to repeat inside a function an use setInterval() (click for documentation with examples) for repeating it.
myFunction() {
//...
// Your code
//...
}
setInterval(myFunction, 5000);
And if you want it to start immediately and then repeat:
myFunction();
setInterval(myFunction, 5000);
setInterval will execute a given function periodically, for example like this:
setInterval( function() {
if(total == randnum) {
$('#result').append('Correct<br/>');
} else {
$('#result').append('Incorrect<br/>');
}
}, 5000);
Where
Of course you will have to define total and randnum.
See this jsFiddle.

Refresh content with jquery

I want to refresh the content of a div with jquery. I have this code but it always says the data and data_check doesn't match while they do when I alert them...
$(document).ready(function(){
pageLoad();
});
function reloadPage()
{
setTimeout(function(){
pageLoad();
},5000);
}
function pageLoad()
{
var data_check = $("div.portlet-body").html().replace(/\s+/g, '');
$.post("paginas/overzicht_sub.php",
function(data){
var data_output = data.replace(/\s+/g, '')
if(data_output==data_check)
{
return false;
}
else
{
$("div.portlet-body").html(data);
}
});
reloadPage();
}
Can someone help? I don't see the problem...
Ok I found the problem! There was a A-tag that always ended when there was no A-tag started. In the HTML (data_check) was that tag deleted and in the data not. Many thanks for the responses, I try to do it the next time with versions!
Remove the replace statement in pageLoad()
function pageLoad(){
var data_check = $("div.portlet-body").html();
$.post("aginas/overzicht_sub.php", function(data){
if(data_output==data){
return false;
}else{
$("div.portlet-body").html(data);
}
});
reloadPage();
}

onclick return and javascript

and thanks to anyone who can help me!
I have a text with this code:
<a onclick="return showPic(this); mostrarespectacular()" href="Imatges/productosnuevos/urbano01.jpg">&nbsp Circuito Espectacular Barcelona</a>
and the scripts are:
<script type="text/javascript">
function showPic (whichpic) {
if (document.getElementById) {
document.getElementById('imgContenedor').src = whichpic.href;
if (whichpic.title) {
document.getElementById('imgDescripcion').childNodes[0].innerHTML = whichpic.innerHTML;
}
return false;
} else {
return true;
}
}
</script>
<script type="text/javascript">
function mostrarespectacular() {
div = document.getElementById('circuloespectacular');
div.style.display = 'inline';
}
function cerrarespectacular() {
div = document.getElementById('circuloespectacular');
div.style.display='none';
}
</script>
and my problem is that the first function works perfect but not the second one (which has to show a div). Any ideas of what i'm doing wrong? Thanks!!
You return from the onclick after the first function call. Remove that and you should be fine.
The "return" is branching out of the script after calling the showPic() function. Remove the return or place it before the "mostrarespectacular()" call or move it to the end, etc.

Categories