Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 7 years ago.
Improve this question
I'm using this js code to change the background image but I'm unsure what needs to be referenced in the .css file. I read nothing but I am still getting a blank screen.
$(function() {
var body = $(‘body’);
var backgrounds = new Array(
‘url(images/bg.jpeg)’,
‘url(images/bg2.jpeg)’
‘url(images/bg3.jpeg)’
);
var current = 0;
function nextBackground() {
body.css(
‘background’,
backgrounds[current = ++current % backgrounds.length]
);
setTimeout(nextBackground, 10000);
}
setTimeout(nextBackground, 10000);
body.css(‘background’, backgrounds[0]);
});
I've also installed jquery by referencing the google CDN.
Many thanks for your help.
T
Since this doesn't have an official answer, I'll answer it, even though this is a repeat from the comments in the question.
The problem was the ‘curly quotes.’ They needed to be 'straight quotes.'
The code you provided uses incorrect quote marks for strings (‘ instead of '), and was missing a comma (,) after the second background.
$(function() {
var body = $('body');
var backgrounds = new Array(
'url(images/bg.jpeg)',
'url(images/bg2.jpeg)',
'url(images/bg3.jpeg)'
);
var current = 0;
function nextBackground() {
body.css(
'background',
backgrounds[current = ++current % backgrounds.length]
);
setTimeout(nextBackground, 10000);
}
setTimeout(nextBackground, 10000);
body.css('background', backgrounds[0]);
});
You can see a demo of it working here with colors instead of background images:
https://jsfiddle.net/kb58tvo9/1/
(A tidied up version here: https://jsfiddle.net/kb58tvo9/2/)
Related
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 6 years ago.
Improve this question
EDIT
I had character blindness with this one and it was missing a dollar. Despite looking at the code in detail and running it through a number of online lint programs I didn't pick up on the missing dollar.
It was just one of those things and I'm sorry.
/EDIT
I've looked on stack overflow and the similar problems I've found appear to be when calling against an array, but I'm calling against an Id.
When I run the following I get:
Uncaught TypeError: "#consoleLog".hasClass is not a function
code:
if(msg.data.match(/^LCERROR/) || msg.data.match(/^ERROR/)) {
if (!('#consoleLog').hasClass('stop')){
setInterval(function() {
$('#consoleLog').animate( { backgroundColor : "#aa0000" }, 1000)
.animate( { backgroundColor : "black" }, 1000);
}, 100);
};
};
With my limited understanding of Jquery and Javascript I thought an Id was a valid DOM to call hasClass() with. It even has examples of it here: https://api.jquery.com/hasclass/
Any idea what might be happening here?
Purpose of the code is:
If the socket message contains ERROR or LCERROR, flash this div between black and red unless the stop class has been called.
You missed off the jQuery constructor function literal ($) in your if() statement:
if( msg.data.match(/^LCERROR/) || msg.data.match(/^ERROR/) )
{
if( ! $('#consoleLog').hasClass('stop') )
{
setInterval(function() {
$('#consoleLog').animate( { backgroundColor : "#aa0000" }, 1000).animate( { backgroundColor : "black" }, 1000);
}, 100);
}
}
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 6 years ago.
Improve this question
I'm writing a simple jquery code to animation an element on my page:
curent
$('#tgs-nav-icon').on('click', function() {
var $nav = (".canvas-menu-content");
var bounceInRight = "bounceInRight animated";
if(! $nav.hasClass(bounceInRight) ) {
$nav.addClass(bounceInRight);
}
else {
$nav.removeClass(bounceInRight);
}
});
Uncaught TypeError: nav.hasclass is not a function
I tried testing this to see where I went wrong and this code comes back false as it should:
var help = $( ".canvas-menu-content" );
console.log(help.hasClass("foo"));
I can't figure out why the if statement is throwing me the error.
I've tried doing some research, but none of the previous questions seem to answer my issue.
You're assigning $nav to the string ".canvas-menu-content" here:
var $nav = (".canvas-menu-content"); // $nav is now '.canvas-menu-content'
Assign it to a jQuery object instead:
var $nav = $(".canvas-menu-content"); // $nav is now a jQuery object containing all
// elements with class canvas-menu-content
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 7 years ago.
Improve this question
I have written this javascript code to add images each after a delay of 3 seconds but this code is not working kindly help.
function start() {
while(true) {
setTimeout(addObstracles(), 3000)
}
}
function addObstracle() {
var element = document.createElement('img');
element.id = 'obs';
element.className = 'obstracleAnimation';
element.src = 'enemy.png';
element.style.position = 'absolute';
element.style.top = '0px';
element.style.left = '100%';
element.style.width = '150px';
element.style.height = '100px';
document.body.appendChild(element);
}
setTimeout takes a function reference. You have a function invokation.
There are multiple ways to write this out:
setTimeout('addObstracles()', 3000) //i don't like this way
setTimeout(addObstracles, 3000) // pass the reference (I like this way!)
setTimeout(function() {
addObstracles()
}, 3000) //I like this when `addObstracles has parameters!
Like Sterling mentioned in his anser, you are calling the function addObstracles instead of passing it to setTimeout, just i want to add to it that because you are setting timout functions on fixed intervals you can use setInterval function instead:
function start() {
setInterval (addObstracles, 3000);
}
JSFiddle
There are multiple issues with this code. I will add to the answers the following:
be careful what function you define and what function you call: something != somethings
be careful where you call your start() function: it has to be after the body tag or body.appendChild won't exist
be careful how you style your element. With the current styling, it is not displayed at all. I have just removed element.style.position = 'absolute'; to make it visible
make sure the image you are trying to display is in the same folder as the script
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 7 years ago.
Improve this question
I found answers alluding to this question but most of them seemed to be based on jQuery. As an exercise I am building a image slider app in jQuery and then Javascript. I want to understand what jQuery is doing under the hood, and be able to make the decision to use it or not based on the project.
My problem is this: when I click the next button, I want the gallery to slide to the left, and prevImg will be removed, currentImg will become next and so forth. I will then add a li element with the appropriate class nextImg and the image.
Everything is working fine, but the line of code nextImg.appendChild(next_ImgPath) is not appending an image.
function slideAnimSetting(direction) {
counterAction();
if (direction == 1) {
establishImgPaths();
for (var i = 0; i < innerListEl.length; i++) {
leftPosition = innerListEl[i].offsetLeft;
topPosition = innerListEl[i].offsetTop;
Tween.to(innerListEl[i], 1, {left: leftPosition-700});
}; // end for
prevImg.removeAttribute('class');
currentImg.className = 'prevImg';
nextImg.className = 'currentImg';
listEle = document.createElement('li');
listEle.className = 'nextImg';
for (var i = 0; i < innerUlEl.length; i++) {
innerUlEl[i].appendChild(listEle);
}; //end for
nextImg = document.getElementsByClassName('next-img');
nextImg = nextImg[0];
nextImg.appendChild(next_ImgPath);
setImageStyles();
}
}; // end slideAnimSetting
The console.log is telling me that nextImg is undefined.
You gave it a className of nextImg, but you're searching for next-img.
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 8 years ago.
Improve this question
I am trying to accomplish a 'simple' jQuery effect.
When an user loads their dashboard, and they have a specific id (#) in the url, the dashboard should load the content assigned to that specific id.
Here is what I have so far:
var pathname = window.location.hash.substr(1);
if(pathname = loadextra){
$('.loadextra').addClass('active');
$('.load-fixed').removeClass('active');
$('.fixed-ads').hide();
$('#loader').show().html('<div class="typing_loader_holder"><div class="typing_loader"></div></div>');
setTimeout(
function()
{
$('#loader').hide();
$('.extra-ads').show();
}, 2000);
}elseif(pathname = loadfixed){
$(this).addClass('active');
$('.load-extra').removeClass('active');
$('.extra-ads').hide();
$('#loader').show().html('<div class="typing_loader_holder"><div class="typing_loader"></div></div>');
setTimeout(
function()
{
$('#loader').hide();
$('.fixed-ads').show();
}, 2000);
}else{
//do nothing
}
So, imagine an user goes to: http://website.com/user#loadextra then the code inside if(pathname = loadextra){} should be fired off - same goes for #loadfixed
Although, as it is now, if you just goes to http://website.com/user, then if(pathname = loadextra){} is fired of.
Why doesn't the if/elseif/else statement work in my code?
You have make three mistakes:
1) Replace '=' with '==' in if & elseif
2) Replace 'elseif' with 'else if'
3)Replace $(this).addClass('active'); with $('.loadfixed').addClass('active');
Try this:
if(pathname == loadextra)