FreeCodeCamp/HelpFrontEnd

Get help on our Front End Development projects.

Raghav Mundra

@Raghav17

Hi!
If I want to change the colour of my div for 3 seconds and change it back to normal how can I do that using javascipt? I tried this but it isn't working.

$("#2").animate({
        "background-color": "white"
    })
    .delay(3000)
    .animate({
        "background-color": "blue"
    }, 1000);

Claudio Restifo

@Marmiz

@Raghav17 You don't need JS to do stuff like this: CSS3 supports animations :)
You can set an animation using keyframes:

/* apply your animation to a class and add a duration */
.my-class {
  animation: NAME-YOUR-ANIMATION 3s
}

/* my animation definition */
@keyframes NAME-YOUR-ANIMATION {
  0%   { background-color: red; }
  50%  { background-color: blue; }
  100% { background-color: red; }
}

Or you can use transition if you want to react to specifics events (eg change color for 3 seconds after a hover or click)

Ehsan Shadmehri

@ehsansh

hi, I am learning Full Stack Web App using Vue.js & Express.js by freeCodeCamp I have a problem when I send post request from client to server in cmd I could see the post request is received but I see this error in client page POST http://localhost:8081/register 404 (Not Found) what is the solution?

Tiago Correia

@tiagocorreiaalmeida

well you are making a request to a route that's not handled by your server

Ehsan Shadmehri

@ehsansh

I have written this code in my server app.js file

app.get('/register',function(req,res){
    console.log('post comes')
    res.send({
        message:'hello world'
    })
})

Tiago Correia

@tiagocorreiaalmeida

get and post are not the same thing :D

Ehsan Shadmehri

@ehsansh

Oh, what a mistake! I did not see that. Thans a lot :)

Tiago Correia

@tiagocorreiaalmeida

no worries, we all ahve been there :D

habibaatify

@habibatify_twitter

what is wrong

why it not working?

Tiago Correia

@tiagocorreiaalmeida

can I see the code?

habibaatify

@habibatify_twitter

https://files.gitter.im/FreeCodeCamp/HelpFrontEnd/fd1b/Capture.PNG

that is code

Abraham Anak Agung

@AbrahamAnakAgung

@habibatify_twitter as i remember, you need\SecondLine\, so you missed couple of \\

habibaatify

@habibatify_twitter

thanks

Liam Docherty

@liamdocherty

@khaduch Hi, I'm still having trouble.

hosted my site homepage displays like this
https://ibb.co/gbgbEn

When hosted on git pages it looks like this
https://ibb.co/eWsiun

https://github.com/liamdocherty/liamdocherty.github.io

Could it have something to do with these console errors? I have no idea how to fix them though.

liamdocherty.github.io/:108 Mixed Content: The page at 'https://liamdocherty.github.io/' was loaded over HTTPS, but requested an insecure image 'http://www.coolhdwallpapers.net/gallery/adidas-logo-black-background-wallpaper.jpg'. This content should also be served over HTTPS.
liamdocherty.github.io/:113 Mixed Content: The page at 'https://liamdocherty.github.io/' was loaded over HTTPS, but requested an insecure image 'http://www.gsfdcy.com/data/img/67/1913982-polo-wallpaper.jpg'. This content should also be served over HTTPS.
liamdocherty.github.io/:14 GET https://liamdocherty.github.io/css/animate.css net::ERR_ABORTED
liamdocherty.github.io/:15 GET https://liamdocherty.github.io/bower_components/Morphext/dist/morphext.css net::ERR_ABORTED
liamdocherty.github.io/:20 GET https://liamdocherty.github.io/CSS/design.css net::ERR_ABORTED
liamdocherty.github.io/:21 GET https://liamdocherty.github.io/CSS/media_queries.css net::ERR_ABORTED
liamdocherty.github.io/:224 GET https://liamdocherty.github.io/JS/smooth-scroll-master/dist/js/smooth-scroll.js net::ERR_ABORTED
liamdocherty.github.io/:226 GET https://liamdocherty.github.io/JS/javascript.js net::ERR_ABORTED
(index):224 GET https://liamdocherty.github.io/JS/smooth-scroll-master/dist/js/smooth-scroll.js net::ERR_ABORTED

Sorin Ruse

@sorinr

@liamdocherty changing <link href="CSS/design.css" rel="stylesheet"> into <link href="css/design.css" rel="stylesheet"> solves your links problem. same for media_quries.css file

Sorin Ruse

@sorinr

@liamdocherty just take care of the url's case sensitivity :)

Liam Docherty

@liamdocherty

@sorinr What a silly error on my part sorry. Thanks 2 both of you @sorinr @khaduch

CamperBot

@camperbot

liamdocherty sends brownie points to @sorinr and @khaduch :sparkles: :thumbsup: :sparkles:

:star2: 1412 | @sorinr |http://www.freecodecamp.org/sorinr

:star2: 3842 | @khaduch |http://www.freecodecamp.org/khaduch

Sorin Ruse

@sorinr

@liamdocherty :+1:

habibaatify

@habibatify_twitter

what is wrogn?

wrong?

Stephen James

@sjames1958gm

@habibatify_twitter I imagine that the test is expecting you to assign the result of .pop to the variable.
It ends up being the same but some of the test checking is fairly specific

habibaatify

@habibatify_twitter

it not working

Dmytro Holysh

@dmk1111

@habibatify_twitter just try to refresh the page & run tests again

Stephen James

@sjames1958gm

Like this?

// Only change code below this line.
var removedFromMyArray = myArray.pop();

habibaatify

@habibatify_twitter

i did not working

thanks @sjames1958gm

CamperBot

@camperbot

habibatify_twitter sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:

:star2: 9158 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm

Tunde Oretade

@tundeiness

any help with this?

https://codepen.io/highness/pen/LjBZgr?editors=1111

last challenge is to move all the search result as close as possible to the search icons

class container holds the search output and the wrap class. So what I did was to animate the wrap class so that it will go to the top of the container anytime i press the search icon. but the challenge right now is how to move the result closer to the top like the wrap class. Any heads up?

Tiago Correia

@tiagocorreiaalmeida