The latest articles on DEV Community by niiknikk (@niiknikk). https://dev.to/niiknikk https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F543861%2F0f57d2b1-4da3-4878-b949-1a22a9e2472d.png https://dev.to/niiknikk en niiknikk Mon, 17 Jan 2022 14:08:51 +0000 https://dev.to/niiknikk/picking-the-right-cursor-in-css-2pjd https://dev.to/niiknikk/picking-the-right-cursor-in-css-2pjd <p>The <code>cursor</code> property specifies the mouse cursor to be displayed when pointing over an element.</p> <p>This common UX practise can be used to convey the idea of certain functionality. This is especially useful in web apps where different tasks can be done other than clicking.</p> <p><strong>The cursor pointer and cursor disabled</strong></p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--RTqUv5_k--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uchckvq6eil3vremd6e0.gif" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--RTqUv5_k--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uchckvq6eil3vremd6e0.gif" alt="The cursor pointer and cursor disabled" width="880" height="495"></a></p> <p><strong>Zoom-in and Zoom-out cursor</strong></p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--wMJVJtsc--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pbrk3o7w7z0q4zxif732.gif" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--wMJVJtsc--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pbrk3o7w7z0q4zxif732.gif" alt="Zoom-in and Zoom-out cursor" width="880" height="495"></a></p> <p><strong>The cursor can also be an image:</strong></p> <p><a href="https://res.cloudinary.com/practicaldev/image/fetch/s--6U0bLf__--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/q1s5aceokb21ktwcmc0z.gif" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--6U0bLf__--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/q1s5aceokb21ktwcmc0z.gif" alt="The cursor can also be an image" width="880" height="495"></a></p> <p>Here is a set of build-in cursors that can be instantly used to improve the usability of we apps, with very less code.<br> <a href="https://res.cloudinary.com/practicaldev/image/fetch/s--duxVlnI1--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wv24fc729teycbggfq3w.png" class="article-body-image-wrapper"><img src="https://res.cloudinary.com/practicaldev/image/fetch/s--duxVlnI1--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wv24fc729teycbggfq3w.png" alt="Set of build-in cursor using CSS" width="880" height="495"></a></p> niiknikk Sat, 01 May 2021 17:58:09 +0000 https://dev.to/niiknikk/weather-app-using-nodejs-5fba https://dev.to/niiknikk/weather-app-using-nodejs-5fba <p>Demo site: <a href="http://weatherapp-nikhil.herokuapp.com/">http://weatherapp-nikhil.herokuapp.com/</a><br> Source code :<br> <a href="https://github.com/niiknikk/weather-app">https://github.com/niiknikk/weather-app</a></p> <p>Please do follow me on twitter <br> <a href="https://twitter.com/_niikhil?s=08">https://twitter.com/_niikhil?s=08</a></p> niiknikk Thu, 25 Mar 2021 08:18:51 +0000 https://dev.to/niiknikk/netflix-navigation-33e7 https://dev.to/niiknikk/netflix-navigation-33e7 <p>Netflix Navigation Bar <a href="https://t.co/gdlAFy5Gsv">https://t.co/gdlAFy5Gsv</a> via @CodePen</p> <h1> codepen #DEVCommunity #webdevelopment #100DaysOfCode </h1> niiknikk Thu, 18 Mar 2021 10:37:13 +0000 https://dev.to/niiknikk/sticky-navbar-by-nikhil-35jc https://dev.to/niiknikk/sticky-navbar-by-nikhil-35jc <p><iframe height="600" src="https://codepen.io/_nikkkhil/embed/Rwozbgq?height=600&amp;default-tab=result&amp;embed-version=2"> </iframe> </p> codepen niiknikk Mon, 08 Mar 2021 11:59:39 +0000 https://dev.to/niiknikk/css-loading-animation-1883 https://dev.to/niiknikk/css-loading-animation-1883 <p><iframe height="600" src="https://codepen.io/_nikkkhil/embed/eYBPBBO?height=600&amp;default-tab=result&amp;embed-version=2"> </iframe> </p> codepen niiknikk Thu, 14 Jan 2021 08:13:57 +0000 https://dev.to/niiknikk/animated-navbar-4e83 https://dev.to/niiknikk/animated-navbar-4e83 <p><iframe height="600" src="https://codepen.io/Niik_nikk/embed/YzGRZxv?height=600&amp;default-tab=result&amp;embed-version=2"> </iframe> </p> codepen