The approach was to make the scrolling stop and highlight the text a.k.a “reduce the opacity” when user points on the text and resume the same when user takes out the mouse. I wrote a small yet clever JS function for that, what my JS did was it sets the attribute called onmouseove to an inbuilt function called this.stop() and onmouseout to this.start() that reduces my job , hush!. Now , I made two functions one to increase the opacity and the other to set it back. It sounds simple right? Well it is, the the problem was the number of time i need to call those function and it WAS MAKING MY SWEET, SIMPLE, SEXY, AND GORGEOUS JS (no! I am not describing my dream girl ) to look tedious so I had to do something so I made a parameterized function and incorporated into it. So, the code is ……*DRUM ROLLS *
ON MOUSE OVER
ON MOUSE OUT
Cool! isn’t it ! Well I think so these many lines of code did that amazing job. Ok! Something I wanted to share, to all the noobs like me who must be thinking WTH! I wrote document.getElementById when I had the option of making it a variable. The answer to that question is IT CAUSES GLOBAL VARIABLE POLLUTION, in short it increases the size of the webpage and make it heavy and difficult to load . So , try this out people hope you like it I am putting up the code for this page as well as the whole website on git to check out here . Feel free to commit and criticize ! peace out until next time.
Did you find this article valuable?
Support Farhaan Bukhsh by becoming a sponsor. Any amount is appreciated!