FreeCodeCamp/HelpFrontEnd

Get help on our Front End Development projects.

Moisés Man

@moigithub

probably u need to add VENDOR prefixes too

.example {
    -webkit-transition: background-color 500ms ease-out 1s;
    -moz-transition: background-color 500ms ease-out 1s;
    -o-transition: background-color 500ms ease-out 1s;
    transition: background-color 500ms ease-out 1s;
}

Nate Mallison

@NJM8

That could be it too. I always run my css through autoprefixer online

Great tool

Mark Kubik

@KUBIX90

interesting, I'll take a look at that tool, thanks

Closed a few windows and seems to be smoother now, really odd

Ian

@toianw

@KUBIX90 The hover animations seem fine to me on both firefox and chrome.

Mark Kubik

@KUBIX90

Yeah its working Ok for me now as well

not sure what happened tbh

nah somethings not right the performance is really erratic

It's working terribl on firefox

terribly

a27-suryansh

@a27-suryansh

can anyone help me with jquery? i have a small problem

Matej Bošnjak

@mbosnjak01

post question

a27-suryansh

@a27-suryansh

@mbosnjak01 the thing is i am adding class to image element dynamically using jquery on click event and in the inspector it changes the class to "changed" however when i target the the element using .changed it is unable to find it

Matej Bošnjak

@mbosnjak01

post code as well

a27-suryansh

@a27-suryansh

sure

~~~

 <script type="text/javascript">
     $(document).ready(function() {

$(".clk_london_map2").on("click", function() {
$(".clk_london_map1").attr("src", "images/london_map2.png");
$(".clk_london_map2").attr("src", "images/london_map.png");
$(".clk_london_map2").attr("id", "clk_london_map2_changed");
});


     $("#clk_london_map2_changed").on("click", function() {

$("#clk_london_map2_changed").attr("src", "images/london_map2.png");

});

     });

```

Second click function is not working only god knows why

 $("#clk_london_map2_changed").on("click", function() {

$("#clk_london_map2_changed").attr("src", "images/london_map2.png");

});

Matej Bošnjak

@mbosnjak01

would need whole code, you got codepen?

a27-suryansh

@a27-suryansh

i have only this code for jquery

Stephen James

@sjames1958gm

@a27-suryansh $("#clk_london_map2_changed").on("click", function() { this code is likely running before the code above it so the id is not yet assigned to the element

@a27-suryansh Why not put that code at the bottom inside the .ready function?

a27-suryansh

@a27-suryansh

@sjames1958gm it is already under that

Stephen James

@sjames1958gm

@a27-suryansh Oops - never mind - it is there already - forget all I said

a27-suryansh

@a27-suryansh

@sjames1958gm i have heard that we cannot target elements with dynamically added classes is that right?

Stephen James

@sjames1958gm

@a27-suryansh I doubt that is the case, but there might be some timing issue.
Why are you targetting an element with #clk_london_map2_changed when you can already target it with ".clk_london_map2"

Unless this is some sort of experiment?

a27-suryansh

@a27-suryansh

no actually there are images of map in the web page and when user clicks on map2 then both maps should interchange that's why @sjames1958gm

@sjames1958gm there are only 2 maps

Stephen James

@sjames1958gm

@a27-suryansh Dang I should look closer did not see the 1 and the 2

a27-suryansh

@a27-suryansh

It interchanges one time but fails to interchange second time coz you know second click function is not working @sjames1958gm

Stephen James

@sjames1958gm

@a27-suryansh You cannot target a element when the id is added later. After you add the id to the element, then you can target it

a27-suryansh

@a27-suryansh

@sjames1958gm as you can see in my code i am first changing the class only then i am targeting it on the next click event

```

$(".clk_london_map2").on("click", function() {

this changes the id @sjames1958gm

i cant figure out what i am doing wrong @sjames1958gm

Stephen James

@sjames1958gm

@a27-suryansh
$("#clk_london_map2_changed").on("click", function() {
This code runs on page ready, before you have ever clicked and run the code above it.
You cannot reference an ID that is assigned later

a27-suryansh

@a27-suryansh

ok got it @sjames1958gm

Stephen James

@sjames1958gm

@a27-suryansh :+1:

a27-suryansh

@a27-suryansh

@sjames1958gm i think this code should be placed under the first click event right?

Damn @sjames1958gm

@sjames1958gm Works like a charm!

Stephen James

@sjames1958gm

:+1:

Timing is everything :)

a27-suryansh

@a27-suryansh

@sjames1958gm may god bless you i was stuck at it for hours

Where communities thrive

People

Repo info

Activity