Help needed to write javascript in react app

ksencherey — Thu, 03 Nov 2022 15:02:32 +0000

Hi Team, I have this javascript code which is used in my html file to rotate a carousel.
Javacsript.js

var angle = 0;
function galleryspin(sign) {
  spinner = document.querySelector("#spinner");
  if (!sign) {
    angle = angle + 45;
  } else {
    angle = angle - 45;
  }
  spinner.setAttribute(
    "style",
    "-webkit-transform: rotateY(" +
      angle +
      "deg); -moz-transform: rotateY(" +
      angle +
      "deg); transform: rotateY(" +
      angle +
      "deg);"
  );
}

The html line which calls this function looks like this.

<div> 
        <p class="Carousel-header">Text
        </p>   
      <base href="1.jpg" />  
        <div id="carousel3D">
          <figure id="spinner">
            <img src="images/1.jpg" alt />
            <img src="images/2.jpg" alt />
            <img src="images/3.jpg" alt />
            <img src="images/4.jpg" alt />
            <img src="images/5.jpg" alt />
            <img src="images/6.jpg" alt />
            <img src="images/7.jpg" alt />
            <img src="images/8.jpg" alt />
            <img src="images/9.jpg" alt />

          </figure>
        </div>
        <div class="carousel-nav">
<span  class="ss-icon  left" onclick="galleryspin('-')"
              >&lt;</span
            >
            <span class="ss-icon  right"onclick="galleryspin('')"
              >&gt;</span
            >
        </div>
    </div>

I want to implement this in react js. I have created the rfce for the

but the code is not working when I click on the < and > buttons to rotate. Looks like the onclick is not calling the galleryspin function. How do I get this to work in react app?

Forem: ksencherey

Help needed to write javascript in react app