Web Hub

Web Development Learners Hub



Super friendly <br/>code & developer communities

Super friendly
code & developer communities

A place for coders and developers to share, learn and grow together.

If anyone wants a swipe detector, made with pure JS, here it is!-
<!DOCTYPE html>
<html lang="en">
<head>
				<meta charset="UTF-8">
				<meta name="viewport" content="width=device-width, initial-scale=1.0">
				<title>Swipe Detector</title>
</head>
<body>
				<script>
								var x = 50;
								var y = 50;
								var sx = 1;
								var sy = 1;
								var timeTrue = false;
								var threshold = 150;
								var timeOut = 100;
								var coord = {
												x: undefined,
												y: undefined
								}
								var prevcoord = {
												x: undefined,
												y: undefined
									 }
									 var swipeDirection = "None";
									 	window.addEventListener("touchstart", function(e) {
									 	 		coord.x = e.touches[0].clientX;
									 	 		coord.y = e.touches[0].clientY;
											coord.x = e.touches[0].clientX;
									 	 		coord.y = e.touches[0].clientY;	prevcoord.x = coord.x;
												prevcoord.y = coord.y;
												timeTrue = false;
												window.addEventListener("touchmove", function(e) {
									 	 		coord.x = e.touches[0].clientX;
									 	 		coord.y = e.touches[0].clientY;
									 	 		setTimeout(function() {
									 	 						timeTrue = true;
									 	 		}, timeOut)
									 	 		if (timeTrue != true) {
									 	 		timeTrue = false;
												if (prevcoord.x + threshold < coord.x) {
												swipeDirection = "right";
												} if (prevcoord.x - threshold > coord.x) {
												swipeDirection = "left";
												} if (prevcoord.y + threshold < coord.y) {
												swipeDirection = "down";
												} if (prevcoord.y - threshold > coord.y) {
												swipeDirection = "up";
												}
												}
												})
								})

							        /* So Now there's this variable called swipeDirection which has either of these values stored, "up", "bottom", "right", "left". So you can use it in if functions, such as-
                                                                   if (swipeDirection == "up") {
                                                                           console.log("Swiped Up");
                                                                   } 
                                                                   Now obviously you will have to put this in an interval and do stuff. */
				</script>
</body>
</html>
0      Reply

Hello, can someone studying in international relations work in the software industry? So will it be a problem to study in a different department? And where can I learn front end?

0      Reply

How do I build my portfolio

1      Reply

How do I build my portfolio

0      Reply

What are the best project ideas for beginners using only HTML and CSS?

3      Reply

Graphql Or Rest, Which would you choose?

2      Reply

Please what is the best way to learn web development ?please answer me

4      Reply

Is there any better website or app to learn HTML and CSS.

Except:- Udemy, Codecademy and Mimo

7      Reply

Hey guys am planning of creating something big. Who want to join me

12      Reply

Javascript

0      Reply

Can we break angular.forEach loop? If yes, How? If no, why?

3      Reply
Which is better? ReactJS or VueJS?

I am planning to learn one of them and asking which one is better to begin?

3      Reply

👋 Hi guys! Welcome to the new community.

People learning Web development can ask questions here or start discussions related to web development here.🌐

1      Reply