All Questions
Tagged with css javascript
593 questions
4
votes
1
answer
88
views
Code for smart CSS rounding using JavaScript
I wrote a project that allows you to make CSS corner rounding more consistent and, in my opinion, nicer. Here's full GIT repo with an example and a README.md: https:...
2
votes
1
answer
339
views
HTML Editor: Online HTML Editor with Real-Time Preview
Overview
HTML Editor is a web-based HTML editor designed for web developers, designers, and learners. It offers a lightweight, minimalist environment for writing and previewing HTML, CSS, and ...
7
votes
2
answers
300
views
Library project - javascript
I am going through the Odin Project and have just finished the 'Library' project on their FullStack JavaScript course. As this is the first time I'll have my code reviewed, I want to know what I'm ...
4
votes
1
answer
377
views
Tic Tac Toe with only the 3 last moves
I wrote a Tic-Tac-Toe game that unlike the normal TTT only saves the last 3 moves. That means, that the first move will be removed on the 4th move and so on.
To not necessarily extend the description ...
3
votes
1
answer
395
views
Event sourcing javascript implementation
An event source built around an observer design pattern implementation…
...
4
votes
1
answer
455
views
HTML Editor, Online HTML Editor with Real-Time Preview
Note
Please review the new question and ignore the following.
Overview
HTML Editor is a web-based HTML editor designed for web developers, designers, and learners. It offers a light-weight, ...
4
votes
1
answer
594
views
HTML Editor : online HTML editor with real-time preview
Note
Please review the new question and ignore the following.
Overview
HTML Editor is an online HTML editor with a minimalist approach. Edit your HTML, CSS, and JavaScript code and monitor the ...
0
votes
0
answers
48
views
Convert CSS-styled HTML to Word file without a server
I am building a non-jQuery port of jQuery-Word-Export, which is to my knowledge the best tool to convert CSS-styled HTML to a file that can be opened, edited, and saved on Microsoft Word (Windows and ...
-1
votes
1
answer
86
views
Sine function guessing cognitive app
Please help with improving this application. It is a guessing game, for learning the values of the sine function, and boosting brain power in the process.
...
1
vote
1
answer
143
views
Need help condensing my code so it takes up less lines and it easier to interpret
Description is at the bottom
Here is a link to all the code: Link
...
2
votes
0
answers
74
views
React draggable sliding panel
I'm building a sliding bottom panel as a React component, adapting Phuoc Nguyen's excellent draggable element tutorial.
It currently looks like this:
The expected behavior is:
User taps on button to ...
0
votes
0
answers
58
views
Ascend animation followed by hover effect
This CSS code creates an animation that describes a random movement using the CSS transition property for box-shadow which ...
0
votes
0
answers
38
views
Colorproof dust effect (second thought)
The colorproof dust effect could be enhanced with positionproof feature getting the position of the dusted element (dust container) from its getBoundingClientRect ...
2
votes
0
answers
40
views
Colorproof dust effect
A combination of various css transitions (background-color, box-shadow, opacity, ...
2
votes
1
answer
277
views
auto image slider in js and css
I was just wanting a code review on this image slider I made. I don't have anyone else to give me their opinion on the code I write outside of work, so I'm asking here.
okay so i had made an image ...
5
votes
1
answer
213
views
Tic-tac-toe with JS
I am a beginner and was hoping for some honest feedback on my js code. I struggled quite a bit on this, I did ask gpt to explain some concepts which I find it’s good for but wrote it all myself.
<...
1
vote
2
answers
161
views
Rubik's cube scrambler with timer and list of solves
This is a work in progress Rubik's Cube scramble generator with timer and list of solves. The list of solves is stored using localstorage so that it stays on page reload. A solve can also be deleted ...
0
votes
3
answers
136
views
A Tic Tac Toe Game Made With Javascript
I just finished creating a Tic Tac Toe game in Javascript, but now am wondering if there are ways I could improve upon the code I've written for it. Mind the lack of CSS here.
...
1
vote
1
answer
762
views
Minesweeper game with HTML & CSS & JavaScript
I made a Minesweeper game using HTML, CSS and JavaScript and would like to ask for advice and feedback specifically on the code.
Here are some questions to review:
Is the use of HTML semantics ...
1
vote
1
answer
253
views
Calorie Calculator
I have developed a calorie-tracker webpage and would appreciate some feedback on it. I'm particularly interested in optimizing performance, improving code readability, and ensuring best practices are ...
4
votes
1
answer
192
views
Hangman Game in HTML + CSS + JS
I recently developed a hangman game with HTML, CSS and JavaScript and I would like to get your feedback and tips to improve it. The goal of the game is to guess a secret word before 6 incorrect ...
4
votes
1
answer
898
views
Rock, paper, scissors with HTML & CSS & JS
I started studying web development a few months ago and to practice my skills I decided to do the game of rock, paper, scissors.
Here are some questions for review:
Is the use of HTML semantics ...
1
vote
1
answer
129
views
Form Validation Code Optimization in HTML and JavaScript"
I've been working on a simple form validation code in JavaScript coupled with an HTML form. The form asks for user's basic information, including name, email, country, gender, and skills. There's a ...
7
votes
4
answers
780
views
HTML Editor - online HTML editor with real-time preview
Note
Please review the new question and ignore the following.
Overview
HTML Editor is an online HTML editor with a minimalist approach. Edit your HTML, CSS, and JavaScript code and monitor the ...
4
votes
1
answer
116
views
Legend of Zelda: Breath of the Wild armor upgrade materials tracker
There are plenty of these online already but none of them quite fit what I wanted. I've been meaning to learn some more front-end stuff so I decided to make one myself. I know some JavaScript but ...
2
votes
2
answers
209
views
Text input with currency icon in the center
I want to have a input element for currency where there is a currency icon always at the center (but it adjusts according to the number of digits)
Something like:
This is what I've come up with:
<...
1
vote
2
answers
581
views
Split the Bill and calculate the Tip
I have created a Bill Splitter page that asks for the total bill amount, tip percentage, and the number of people. Then it displays the tip and the total amount (including the tip) each person has to ...
1
vote
1
answer
130
views
Sign Up Page - A mini Frontend Project
I have designed a a small frontend project, a sign-up page. It uses HTML, CSS, JavaScript and jQuery. Being a beginner to frontend development, I want to adapt to all the best practices. I am looking ...
0
votes
2
answers
117
views
How to write repetitive styled components in a cleaner way
I'm using Styled Components for styling and there are many icons defined in the project so in the style file we have this code:
my-component.styles.ts
...
1
vote
1
answer
148
views
First big project using vanilla js and pure css
If i can get a some reviews and suggestion on the code it would be highly appreciated.
( Please check the flowchart i've created first https://github.com/chetinn/Memory-Map-JS/blob/main/Memory%20Map%...
2
votes
1
answer
212
views
All-JavaScript WhatsApp button
The following code creates a WhatsApp button.
How would you improve this code?
...
2
votes
1
answer
817
views
jQuery code to add / remove classes depending on the button clicked
What the code does
What the JQuery code does is add / remove classes on div's elsewhere on the page, depending on the button clicked.
Button 1 clicked → add class ...
3
votes
1
answer
237
views
Responsive Navigation with hamburger menu
This script creates a hamburger menu when the window is resized. It will also create a sticky navigation when the window is scrolled down, which will also create a hamburger menu when the window is ...
3
votes
1
answer
689
views
Javascript : Etch-a-sketch
I am a beginner in javascript and I have made this project as a part of The odin project.
Feautres:
Draw by hovering the mouse on grid
Erase
Clear the entire sketch at once
Reset the grid size
I ...
1
vote
1
answer
415
views
Loading Filtering and Displaying Top 10 Countries Data
I've created a small project that fetches data from a 'countries' API and works around with it to display the 'top 10 most populated countries' & 'top 10 most spoken languages'.
I kindly wish if ...
1
vote
2
answers
5k
views
JS page loading without refresh
As an exercise, I found a basic way of updating pages without refreshing, partially mimicking the behaviour of SPAs and routing libraries such as React Router. I was not looking for something as ...
2
votes
0
answers
91
views
Dropdown menu that visually includes the toggle button in it
I'm a beginner in front-end development and tried to make a dropdown menu that includes the toggle button within the menu, instead of opening a separate menu besides the toggle button. I went with ...
2
votes
1
answer
299
views
CSS gradient text that fades in and out
Here I have a basic text gradient effect which fades into a gradient animation, and fades out of the animation on hover in/out. Without the fade in, it looks janky and jolty. But because of the fade-...
1
vote
1
answer
174
views
Sidenav menu that appears when click on button
I have a side menu that appears when click on button, which works fine. But now I want to clean up my code, shorten it if possible. I was wondering if there is an easier and cleaner way to achieve the ...
1
vote
1
answer
700
views
Add and delete books into this bookshelf vanilla javascript project
In this project I was supposed to add and delete books by author and title by pressing the submit and delete button.
There is a video that illustrates how my project works.
I did it using two ...
7
votes
2
answers
713
views
First JavaScript project: number guessing game
I wanted to share my first experience with JavaScript. I've been taking JS courses for the past 2 months and finally got the first chance to code a small guess-my-number project.
(Everything is ...
1
vote
1
answer
171
views
First Web App - Pig Game
I'm learning web development with JavaScript, HTML, and CSS and have just created my first application, a Pig Game. The app works well, however, I think my CSS is a bit over complicated and that the ...
1
vote
1
answer
735
views
Coding a hamburger menu with JS, CSS & HTML
I've created a menu that allows you to display the list when clicking on the menu icon. I wonder whether this can be improved somehow - can anyone help improve this?
Also, initially I created it with ...
1
vote
1
answer
136
views
Show progress bar for different states
I have this working code which shows the progress bar based on different states ("not-started", "progressing" and "done"). Each state will have its own class.
I notice it ...
1
vote
1
answer
83
views
An alternative way for using html tags to simulate simple firework effect
I have the following code to simulate a firework (of course a very bad and rough one)
...
0
votes
1
answer
282
views
Updating active cards dynamically added by API
I am making a website where you can search through all the countries in the world. Once you have found a country you want more detail about you should be able to click and view a detailed page with ...
6
votes
1
answer
234
views
Small Bayes Calculator to learn Javascript
I am trying to learn UI design so I threw together a Bayes Calculator (i.e. calculate the posterior probability of being sick given a positive/negative test result using the specificity, sensitivity ...
3
votes
0
answers
59
views
Sneakers store UI challenge
So I have been coding for just under 6 months now. I've made many projects but I don't have a clue if I am writing good code. So I did this frontendmentor challenge which includes HTML CSS and JS. It'...
2
votes
2
answers
3k
views
Sorting table rows visually with animation while keeping them intact in the DOM
I have a table which i want to sort the rows visually according to a column while the rows remain intact in the DOM structure. So nodes aren't moving in the DOM or getting replaced with eachother at ...
2
votes
0
answers
75
views
A simple recipe page in HTML, SASS and JS
I've been learning how to design responsive webpages. I got done the basics and can create code that closely resembles the design, but I was wondering what are the best practices in web development ...