UI redesign- Will changing the css affect the javascript

0 votes

I am normally a UX designer, but my work has me learning front-end programming so forgive me if this is a simple question. I tried googling but couldn't find anything. So I am tasked with redesigning the UI for a software solution that is used by IT admins to monitor their devices. I have all the html, css and javascript locally. I want to make a lot of changes that are visual (navbar on top vs on the left side) and navigation based (combining two pages into one). I am trying to understand the html/css but given how extensive it is, I am having trouble making the changes I need to make. If I start the css from scratch, will it affect all the javascript that is currently implemented? I will make some html changes, but will keep the classes/layout mostly the same. Mainly I will focus on css.

I tried editing the css to fit my redesign, but I kept having trouble targeting the right elements and finding out what needed to be changed. I know what I need to do but I cant seem to do it within the confines of the current code. It feels like it would be easier to start from scratch.

Apr 28, 2023 in UI UX Design by Ashwini
• 5,430 points
782 views

1 answer to this question.

0 votes

Changing the CSS code shouldn't affect the JavaScript functionality as long as you're not modifying the CSS classes or IDs used in the JavaScript code. JavaScript code usually interacts with HTML elements through CSS selectors, so if you modify the class or ID names used in your HTML or CSS code, it could potentially break the JavaScript functionality.

That being said, starting from scratch might not be the best approach, especially if the JavaScript code is already working as intended. Instead, I would recommend making a copy of the existing CSS file and working on it separately, making changes incrementally and testing each change to ensure that it doesn't affect the JavaScript functionality.

If you're having trouble targeting the right elements, you can use browser developer tools to inspect the HTML and CSS code and see how the current layout is constructed. This should help you identify which elements to modify and which CSS selectors to use.

answered Apr 28, 2023 by vinayak

Related Questions In UI UX Design

0 votes
1 answer

UI/UX Design in Real Time Applications

When designing for real-time applications like those ...READ MORE

answered Apr 25, 2023 in UI UX Design by vinayak
510 views
0 votes
1 answer

Need UI/UX Design layout name

The layout design that Cleartrip.com uses is ...READ MORE

answered Apr 25, 2023 in UI UX Design by pooja
505 views
0 votes
1 answer

Slack UI/UX design with collapsable columns

To replicate Slack's collapsible functionality using Split.js, ...READ MORE

answered Apr 25, 2023 in UI UX Design by pooja
543 views
0 votes
0 answers

Fading in a background image using javascript or css on hover

I have so far been able to ...READ MORE

Jun 30, 2022 in CSS by Edureka
• 13,620 points
1,058 views
0 votes
1 answer
0 votes
0 answers

Anyone can help me out to understand the semantic of (document.getElementBYId("demo").innerHTML="Hello") ?

Hello guys, Can Someone helps me to find ...READ MORE

Jan 17, 2020 in Web Development by anonymous
• 37,520 points
903 views
+1 vote
1 answer

What is the relationship between angularjs Scope with controller/view?

Let us consider the below block: <div ng-controller="emp"> ...READ MORE

answered Jan 20, 2020 in Web Development by Niroj
• 82,880 points

edited Jan 21, 2020 by Niroj 1,101 views
0 votes
1 answer

UI/UX design or audit - how to measure the costs?

When it comes to charging for a ...READ MORE

answered Apr 25, 2023 in UI UX Design by Tej
560 views
0 votes
1 answer

Outsourcing UI/UX while keeping the app code secret

If you want to outsource your UI/UX ...READ MORE

answered Apr 25, 2023 in UI UX Design by vishalini
495 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP