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:

1. Install the component:

   npm install react-marquee-component
   

2. 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;
   

3. Customize the marqueeTextData array with your data.

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

5. 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;