'How to make text slide in and out of the page

I need to achieve same effect as slide in and out effect like on this page :https://pangrampangram.com/products/neue-machina

javascriptcssnext.js


Solution 1:[1]

create a div inside a another div make the child div bigger than parent div once it get done you can make the child scrolling by left or right attribute in css.

`<html data-test-id="brave-new-tab-page" dir="ltr">
.parent { width: 500px; height: 100px; overflow: hidden; position: absolute; } .child { width: 1347px; font-size: 76px; position: absolute; } test test test test test test test tesenter code heret test test let position = 0; document.addEventListener('DOMContentLoaded', () => { setInterval(() => { let child = document.getElementsByClassName('child')[0] child.setAttribute('style', 'left:-' + position + 'px') 
            if ( position > ( 1347 - 500 ) )
                position = 0

            position ++
        }, 5)
    }, false);
</script>
`

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1

Related Questions