react-marquee-component

Here's a simple README example:

Marquee React Component

Installation

To use the MarqueeText React component, you need to follow these steps:

• Install the component:

  npm install react-marquee-component
  

• Import the component in your React application:

  import React from "react";
  import { MarqueeText } from "react-marquee-component";
  
  const App = () => {
    const marqueeTextData = [
      { id: 1, text: "HTML" },
      { id: 2, text: "CSS" },
      { id: 3, text: "JS" },
      // ... more text data
    ];
  
    const customStyles = {
      // Define your custom styles here
      color: "red",
      fontSize: "20px",
      // ... other styles
    };
  
    return <MarqueeText data={marqueeTextData} style={customStyles} />;
  };
  
  export default App;
  

• Customize the marqueeTextData array with your data.

• Adjust the customStyles object to apply your desired custom styles.

• Run your React application:

  npm start
  

Now, the MarqueeText component will display your text data with the specified styles in a marquee animation.

Props

data

• Type: Array of objects
• Description: An array of objects representing the text data for the MarqueeText component.

style (optional)

• Type: Object
• Description: An optional object containing custom styles to be applied to the list items. Customize it according to your preferences.

Example

import React from "react";
import { MarqueeText } from "react-marquee-component";

const App = () => {
  const marqueeTextData = [
    { id: 1, text: "HTML" },
    { id: 2, text: "CSS" },
    { id: 3, text: "JS" },
    // ... more text data
  ];

  const customStyles = {
    color: "red",
    fontSize: "20px",
    // ... other styles
  };

  return <MarqueeText data={marqueeTextData} style={customStyles} />;
};

export default App;