- 57
- 148 005
Ryan Web Tech
India
เข้าร่วมเมื่อ 26 พ.ย. 2014
Hi. My name is Ryan. On this channel, you'll find videos on how to build stuff using HTML, CSS and JavaScript.
Create a Custom Scrollbar in Pure CSS
In this video, let's customize the scrollbar using a few CSS pseudo elements.
Get the code here - codepen.io/ryandsouza13/pen/LYLxOXM
Find me here:
Twitter: ryanwebtech1
Instagram: ryanwebtech1
Codepen: codepen.io/ryandsouza13/
Dev Community: dev.to/ryandsouza13
Get the code here - codepen.io/ryandsouza13/pen/LYLxOXM
Find me here:
Twitter: ryanwebtech1
Instagram: ryanwebtech1
Codepen: codepen.io/ryandsouza13/
Dev Community: dev.to/ryandsouza13
มุมมอง: 467
วีดีโอ
A Simple Tooltip Using HTML and CSS
มุมมอง 8753 ปีที่แล้ว
In this video, let's create a simple tooltip using HTML and CSS. We'll have a look at 3 different ways to display the tooltip. The first two ways, will involve only CSS. However, the 3rd one uses just a few lines of JavaScript. Get the Code Here - codepen.io/ryandsouza13/pen/wveBrKp Find me here: Twitter: ryanwebtech1 Instagram: ryanwebtech1 Codepen: codepen.io/ryands...
Scroll to Top Button Using HTML, CSS and JavaScript
มุมมอง 1563 ปีที่แล้ว
In this video, let's create a simple scroll-to-top button using HTML, CSS and just a few lines of JavaScript. Get the code here - codepen.io/ryandsouza13/pen/zYzYrEb Find me here: Twitter: ryanwebtech1 Instagram: ryanwebtech1 Codepen: codepen.io/ryandsouza13/ Dev Community: dev.to/ryandsouza13
A Simple Slider Using HTML, CSS and JavaScript
มุมมอง 1703 ปีที่แล้ว
In this video, let's create an auto slideshow using HTML, CSS and JavaScript. Get the code here - codepen.io/ryandsouza13/pen/gORYMYN Find me here: Twitter: ryanwebtech1 Instagram: ryanwebtech1 Codepen: codepen.io/ryandsouza13/ Dev Community: dev.to/ryandsouza13
Calculate the Number of Characters Using JavaScript
มุมมอง 1833 ปีที่แล้ว
In this video, let's have a look at how we can calculate the total number of characters, excluding the spaces, using JavaScript. Get the code here - codepen.io/ryandsouza13/pen/MWmNOVG Find me here: Twitter: ryanwebtech1 Instagram: ryanwebtech1 Codepen: codepen.io/ryandsouza13/ Dev Community: dev.to/ryandsouza13
Show Hide Password Using HTML, CSS and JavaScript
มุมมอง 5833 ปีที่แล้ว
In this video, let's have a look at how we can implement the show/hide password functionality using HTML, CSS and JavaScript Get the code here - codepen.io/ryandsouza13/pen/ZEKNYzE Find me here: Twitter: ryanwebtech1 Instagram: ryanwebtech1 Codepen: codepen.io/ryandsouza13/ Dev Community: dev.to/ryandsouza13
Detect Online/Offline Status using JavaScript
มุมมอง 1.2K3 ปีที่แล้ว
In this short video, let's have a look at how we can detect the online/offline status of a user. Get the code here - codepen.io/ryandsouza13/pen/MWbjEYX Find me here: Twitter: ryanwebtech1 Instagram: ryanwebtech1 Codepen: codepen.io/ryandsouza13/ Dev Community: dev.to/ryandsouza13
Pure CSS Image Slider
มุมมอง 5973 ปีที่แล้ว
In this video, let's create a simple image slider in HTML and CSS. Get the code here - codepen.io/ryandsouza13/pen/BaQzbGg Find me here: Twitter: ryanwebtech1 Instagram: ryanwebtech1 Codepen: codepen.io/ryandsouza13/ Dev Community: dev.to/ryandsouza13
3 Simple Techniques to Create a Text Stroke in HTML and CSS
มุมมอง 5K3 ปีที่แล้ว
In this video, let's have a look at 3 different techniques to create a text stroke in HTML and CSS. The techniques discussed in this video are. 1. Using the -webkit-text-stroke CSS property 2. Using the text-shadow CSS propety 3. Using an SVG Get the code here - codepen.io/ryandsouza13/pen/vYyNvqe Find me here: Twitter: ryanwebtech1 Instagram: ryanwebtech1 Codepen: co...
Gradient Background Generator in HTML, CSS and JavaScript
มุมมอง 1K3 ปีที่แล้ว
In this video, let's create a simple gradient background generator using HTML, CSS and just a few lines of JavaScript. Get the code here - codepen.io/ryandsouza13/pen/LYbpYZq Find me here: Twitter: ryanwebtech1 Instagram: ryanwebtech1 Codepen: codepen.io/ryandsouza13/ Dev Community: dev.to/ryandsouza13
Responsive Table Using HTML and CSS
มุมมอง 10K3 ปีที่แล้ว
In this short video, we'll build a simple responsive table using HTML and CSS. Get the code here - codepen.io/ryandsouza13/pen/zYKGrbQ Find me here: Twitter: ryanwebtech1 Instagram: ryanwebtech1 Codepen: codepen.io/ryandsouza13/ Dev Community: dev.to/ryandsouza13
Simple Accordion Menu Using HTML and CSS
มุมมอง 1624 ปีที่แล้ว
In this video, let's create a simple accordion menu using the HTML 'details' and the 'summary' tags. Get the code here: codepen.io/ryandsouza13/pen/wvGpoRp Find me here: Twitter: ryanwebtech1 Instagram: ryanwebtech1 Codepen: codepen.io/ryandsouza13/ Dev Community: dev.to/ryandsouza13
Marquee Effect in HTML and CSS
มุมมอง 19K4 ปีที่แล้ว
In this video, let's try creating a marquee text effect without using the HTML marquee tag. Get the code here - codepen.io/ryandsouza13/pen/ExKKrOj Written version of this tutorial - dev.to/ryandsouza13/creating-the-classic-marquee-effect-without-the-marquee-tag-4246 Find me here: Twitter: ryanwebtech1 Instagram: ryanwebtech1 Codepen: codepen.io/ryandsouza13/ Dev Comm...
Creating a Fake 3D Effect in HTML and CSS
มุมมอง 1.3K4 ปีที่แล้ว
Hi this video, we'll create a fake 3D effect. The idea for the video popped up when I came across an article titled 'Faking 3D Elements with CSS'. This article by, Bradley Taunt, is about creating a Fake 3D effect with 2 divs. Here is the link to Bradley's article. uglyduck.ca/fake-3d-elements-with-css/ Get the code here - codepen.io/ryandsouza13/pen/RwaPgbm Also, you can find the written versi...
Text Glow Effect using HTML and CSS
มุมมอง 4.7K4 ปีที่แล้ว
Let's create a simple text glow effect in just a few lines of HTML and CSS
Typing Animation Effect Using HTML and CSS
มุมมอง 4995 ปีที่แล้ว
Typing Animation Effect Using HTML and CSS
Responsive Video Background in HTML and CSS
มุมมอง 9K5 ปีที่แล้ว
Responsive Video Background in HTML and CSS
Flipping Card Animation Using HTML and CSS
มุมมอง 24K5 ปีที่แล้ว
Flipping Card Animation Using HTML and CSS
Knockout Text With a Video Background using HTML and CSS
มุมมอง 5785 ปีที่แล้ว
Knockout Text With a Video Background using HTML and CSS
Responsive Masonry Layout in HTML and CSS (2019)
มุมมอง 11K5 ปีที่แล้ว
Responsive Masonry Layout in HTML and CSS (2019)
A Simple Expanding Search Box Using HTML, CSS and JavaScript
มุมมอง 3.7K6 ปีที่แล้ว
A Simple Expanding Search Box Using HTML, CSS and JavaScript
I make you 1.000 subscriber from me
not support for FireFox give me any another scroll solution for Firefox
W
you never told how ajust the background vedio height and width ? its important part to make it responsive right?
same
I'm trying to accomplish this for a sentence in notepad but nothing works. what am i doing wrong?
All the three methods shown in this video use CSS properties that are supported by all major web browsers. So, it should work if you've followed the same steps as shown in this video. However, at times we all do tend to commit some tiny errors while liking our HTML files to our stylesheet. So, in case you are using an external stylesheet, check if any error was unintentionally done while liking it to the HTML file. Apologies for a delayed response though.
Great Video!
Thanks, man! Really cool effect!
Keep up the good work!
Thank you very much.
thanks for this👀
loved it
thanks bro
Awesome video ++++++++++++++++++ 🙂
I’ve watched more than 6 videos .. this is the shortest and most informative.. ❤
thank u so much
Thanks for the help 👍🏼
Good Job! Perfect...
thank you brother you made this property easy for me to understand.
awesome video! exactly what I needed
Really simple, thanks
vary good
Thank you so much Dharm, you explain much better than my professor, hugs from Colombia 🇨🇴🔥
Very simple and straightforward. Thanks for your time
very clear thanks you!
this is the easiest way i have seen .
Straight to the point. Thank you.
You are my master for me 💗
What is your software name
The code editor used in this video is called brackets. It is an open source code editor developed by Adobe. I rarely use it these days as I'm currently using VS code as my primary code editor.
What is your software name
I'm a crazy indian , ahhhhhhhhhhhh
nice 👍
How to make one button responsible for the sides and the second only for the center?Hope you will answer and thanks for the video it helps very much
Hi buddy. Do you mean you want a radial gradient? If yes, then I think a similar approach can help. But, if wish to have a linear gradient with 3 color stops (left, center, right), then you can set one button for the left and the right color gradients together, while the other button for the center gradient color. In this case, the left and the right gradient colors would be the same. Let me know if this is what you needed.
@@RyanWebTech1 Yes one button for the left and right and the other button for center
thanks for wonderful video bro
Excellent content! Keep up with your awesome job Rayan!
awesome
so helpfull thank you
exactly what i was looking for. thanks a bunch ❤️
how the code can detect smartphone there is one choice only, if there is any way to detect computer and smart phone learn us please
thanks a lot it helped me
Thank you so much.
excellent way of delivering understandable stuff. thanks!
Thanks so much, this really helped me with a project I've been working on. Great work.
thx
thx
thx man
Thank you so much Sir! I needed to make this for an assignment, and it works great!
good explan bro👍🏽
exactly what I need
exactly what I need
Height 100vh ? vh not px ? vh is same as px?
Hi Nikhil. The unit vh stands for viewport height. Viewport can be defined as the visible part of the webpage you are currently viewing. So, 1vh is equivalent to 1% of the visible part. In our case, we are giving it a height of 100vh, which means covering 100% of the webpage that is currently visible.
@@RyanWebTech1 thanks