Categories
CSS

How to disable scrolling when touch moving certain element with CSS?

Sometimes, we want to disable scrolling when touch moving certain element with CSS.

In this article, we’ll look at how to disable scrolling when touch moving certain element with CSS.

How to disable scrolling when touch moving certain element with CSS?

To disable scrolling when touch moving certain element with CSS, we set the element’s touch-action CSS style to none.

For instance, we write

touch-action: none;

to disable touch on the element when moving certain element when we add this style to our CSS.

Conclusion

To disable scrolling when touch moving certain element with CSS, we set the element’s touch-action CSS style to none.

Categories
JavaScript Answers

How to load totally new data with Chart.js and JavaScript?

Sometimes, we want to load totally new data with Chart.js and JavaScript.

In this article, we’ll look at how to load totally new data with Chart.js and JavaScript.

How to load totally new data with Chart.js and JavaScript?

To load totally new data with Chart.js and JavaScript, we call destroy on the existing chart and then we create a new chart.

To do this, we write

myLineChart.destroy();

to destroy the myLineChart chart with destroy.

Then we write

const ctx = document.getElementById("myChartLine").getContext("2d");
myLineChart = new Chart(ctx).Line(data, options);

to get the canvas with getElementById.

Then we get the canvas context with getContext.

Finally, we create the new chart with the Chart constructor and the Line method.

Conclusion

To load totally new data with Chart.js and JavaScript, we call destroy on the existing chart and then we create a new chart.

Categories
JavaScript Answers

How to add a variable to console.log with JavaScript?

Sometimes, we want to add a variable to console.log with JavaScript.

In this article, we’ll look at how to add a variable to console.log with JavaScript.

How to add a variable to console.log with JavaScript?

To add a variable to console.log with JavaScript, we can pass it in as an argument.

For instance, we write

console.log("story", name, "story");

to log the value of name as the 2nd entry in the console log between the 2 'story' strings.

Conclusion

To add a variable to console.log with JavaScript, we can pass it in as an argument.

Categories
JavaScript Answers

How to create a custom InfoWindow with Google Maps and JavaScript?

Sometimes, we want to create a custom InfoWindow with Google Maps and JavaScript.

In this article, we’ll look at how to create a custom InfoWindow with Google Maps and JavaScript.

How to create a custom InfoWindow with Google Maps and JavaScript?

To create a custom InfoWindow with Google Maps and JavaScript, we use the InfoWindow constructor.

For instance, we write

const infowindow = new google.maps.InfoWindow();

google.maps.event.addListener(
  marker,
  "mouseover",
  ((marker) => {
    return () => {
      const content = address;
      infowindow.setContent(content);
      infowindow.open(map, marker);
    };
  })(marker)
);

to call the InfoWindow constructor with an object with the content of the InfoWindow.

Then we add a mouseover event listener to the marker.

In the event listener, we have

infowindow.setContent(content)

to set the content of the InfoWindow to the content string.

And then we call open to open the InfoWindow on the marker on the map.

Conclusion

To create a custom InfoWindow with Google Maps and JavaScript, we use the InfoWindow constructor.

Categories
JavaScript Answers

How to convert a string to long in JavaScript?

Sometimes, we want to convert a string to long in JavaScript.

In this article, we’ll look at how to convert a string to long in JavaScript.

How to convert a string to long in JavaScript?

To convert a string to long in JavaScript, we can convert it to a bigint.

For instance, we write

const bi = BigInt("1274836528318476135");

to convert the "1274836528318476135" string to a bigint with the BigInt function.

Conclusion

To convert a string to long in JavaScript, we can convert it to a bigint.

If you like the content of this blog, subscribe to my email list to get exclusive articles not available to anyone else.