CSS, short for Cascading Style Sheets, is a language used to control the presentation of HTML and XML documents including colors, layout, and fonts.

learn more… | top users | synonyms (1)

1
vote
2answers
34 views

Composing a CSS transformation

I have a function that creates a css transform property string based on some global variables. This string can be copied later by a user, so I would prefer to keep the output short. This is my code: ...
1
vote
1answer
22 views

Display related images based on text name

Instead of "Black and Green" text, We are displaying "Black & Green" images with help of below code. What we want is this concept should work for all colors, for that one solution is i need to ...
2
votes
1answer
61 views

My grade calculator with special weighting

My school has a special 65% formal 35% informal weighting, so I made something to find what your grade would be if you added or ...
0
votes
1answer
24 views

Changing placeholder text with CSS only

I am building one of those contact forms that are conversational. I have code that works but I don't think it is optimal (at the bottom). The form looks like: The code is live on this codepen The ...
3
votes
0answers
32 views

Inline Purchase Details

I'm not good at all with CSS, but I try! The following code works (demo here), but I'm sure that can be improved. HTML: ...
7
votes
0answers
66 views

A vanilla JavaScript library for typesetting pseudocode in HTML documents

I have this plain JavaScript library for typesetting pseudocode in HTML documents. (See the documentation for details.) (See the GitHub repository - broken as of now.) Source code algotype.js <...
2
votes
1answer
33 views

Extract rotation values from css string Javascript

I have the following function that takes out the rotation values from a css string and returns them as an array. ...
0
votes
3answers
40 views

Vanilla JS mouse events on dynamically created elements

In terms of performance, what is the best way to bind mouseover/mouseout event on dynamically created elements? This is what I have but I'm not sure it is ok for performance: ...
4
votes
1answer
52 views

George Washington Carver tribute page

Yeah, it's another person wandering through from freeCodeCamp. Sorry. That aside, I've got a tribute page to George Washington Carver, developed as a project for the above. I'm generally happy with ...
-3
votes
0answers
11 views

Can I ask to check my code here? Or did I get this wrong? [migrated]

If so, i will post some of my website mr2ndopinion.com. I'm looking for peer help to improve the experience of the site, i want it to be professional. Unlike my video's which are mostly made for ...
1
vote
1answer
56 views

Create bootstrap toolbar

I have created a bootstrap toolbar(navbar) which is working. my question is, since this is my first time on this topic if there is a place for improvement ? we are using some mock to enter some dummy ...
1
vote
1answer
44 views

Simple parallax using jQuery and CSS

I'm working on a website and am trying to implement a parallax effect on an image and title (possibly other elements too). I'm trigering the effect with .scroll() ...
0
votes
0answers
17 views

Animated Ajax loader: Ascending air bubble

This week I've had an idea for an Ajax loader animation: An air bubble ascending in a glass tube. Something like shown here: https://en.wikipedia.org/wiki/Spirit_level#/media/File:...
0
votes
2answers
156 views

Vue GitHub user lookup

I have made a small Vue app which fulfills the following user stories: Given I make a search for an existing GitHub user, then: The user's username is shown The user's avatar is shown The user's ...
1
vote
1answer
29 views

Bootstrap responsive layout

I'm creating a responsive page with bootstrap. I tested my code with my browser (Firefox and Chrome) and it works. Is the code clean or is there a better way to code it? ...
3
votes
1answer
42 views

Sometimes-sticky HTML element

I am working on a sticky element that on certain point when the user scrolls down it turns into a relative element so it's not a sticky element anymore, only when the user scrolls to the top and ...
1
vote
0answers
31 views

Modals that are centered vertically and horizontally within 80% of the browser size

I'm very new to website development. I would like to know if there is a much better, preferably with less codes, to write this modal. Here is the full website assets if you need to look at how the ...
0
votes
0answers
30 views

jQuery slideshow with connected links and the ability to pause/resume when hovered - follow-up

The stated goal from Take 1: I want a slideshow with three primary pieces of functionality: Has text links that act as bullet-points and can jump directly to a slide when clicked. Pauses ...
4
votes
1answer
51 views

jQuery responsive tabs to accordion

I wrote a script that adapts HTML tabs for different screen resolutions. On a small screen it's an Accordion and on wider ones they're Tabs. The script is for a production site, and I'm not so good in ...
3
votes
1answer
59 views

jQuery slideshow with connected links and the ability to pause/resume when hovered

Update: Here is Take 2. I want a slideshow with three primary pieces of functionality: Has text links that act as bullet-points and can jump directly to a slide when clicked. Pauses when a slide or ...
1
vote
1answer
31 views

Control element with JavaScript and SASS: move options between two select-elements

Who has to use enterprise software like for example Microsoft Access knows that control: There a two select lists. The one list offers possible options. With a button you can add one or multiple ...
2
votes
2answers
75 views

Creating tiles with CSS

I am still a beginner in CSS and am trying to make a tiles/cards design. I have reached this code, and I want to know if my layout this way is good or if there are any improvements I need to make. Is ...
4
votes
0answers
27 views

Polyfill for a legacy system: Attach “labels” to their corresponding checkboxes

I had to do some maintenance programming on a legacy software recently. Most of the system's logic is done with Java and PL SQL. The Java creates some special kind of XML. These XML is then ...
6
votes
2answers
236 views

Simple Business Card Website

I have been learning to code for nearly a month now. Any tips on how I can improve with indenting to help future readers? Snippet ...
2
votes
1answer
43 views

Fitting multiple images in a given width

I was looking for a function which would take the overall width, max height, min height parameters as the input and fit multiple images in the given overall width adjusting their width. For an ...
4
votes
1answer
23 views

Positioning a container next to its menu

I'm a beginner in CSS and need help with a suggestion. I'm working on a project, in which I managed to position container_main right next to ...
1
vote
0answers
56 views

jQuery plugin for dropdown with multiple select

This is my first time creating a jQuery plugin. As there are many tutorials for jQuery plugins, I'm not sure if my code correct. This is my first draft for my plugin, it is working but I haven't ...
1
vote
1answer
25 views

Attach / detach navigation bar depending on scrolled position of the document

The idea is the following: I have a large text with a header upon it and a navigation bar. The navigation bar is located between header and text. If the user scrolls downwards then the header-part ...
0
votes
0answers
19 views

Media Queries Exercise

I am learning responsive design and media queries and am trying to simulate the problem as mentioned here. I am solving a problem where it has to be responsive on devices with 320*470 (android phone) ...
1
vote
0answers
48 views

Gradual color change on scroll

I'm a beginner who wants to learn properly how to write code. The following code takes initial RGB values and gradually changes them (shade by shade) to targeted rgb values, scroll by scroll. The code ...
0
votes
0answers
50 views

Pointer hover animation for a five-star-rating picker

I want to shorten my code. You can see the following code i used many function for addClass, removeClass. But it is not usefully. Can do my work in one hover function ? If yes can anyone help me ? ...
2
votes
1answer
30 views

Responsive video embedding

I figured out a alternative way to make embedded videos responsive and I like to have some feedback on it. Would this be considered a hack or just bad coding to add a extra piece of html to make this ...
0
votes
0answers
27 views

HTML FlexBox Layout

Can someone please review my code . I could not get a picture/snapshot of what im trying to do but,I want to generate a layout which has header/footer and the content section is divided into two ...
0
votes
0answers
15 views

How to better handle and positioning my CSS animation?

This is a new title animation I just created. I think I have optimised the css animation part pretty well using :before element, but last thing I wanna optimise is how it positions and how it ...
3
votes
1answer
72 views

Animating the appearance of a title with CSS

To sum up my project was about making cool animation of titles appearance with an effect of a colored block coming from one side while expanding and disappearing from the others side while contracting ...
1
vote
1answer
58 views

“Spinning wheels” - Animated spinner with SVG and Sass-CSS

I've made this little animation using SVG, CSS-keyframes and a bit of Sass. ...
3
votes
0answers
61 views

Simple JavaScript module to manipulate CSS

After posting some of this code on Stack Overflow I was told to have a look here and get some feedback. I am having fun building a light JavaScript framework and have copied this pattern. It works ...
0
votes
2answers
48 views

One page with owlcarousel

I've done a small one page project with slider (owlcarousel) & CSS3 animations . Could you please look at HTML, CSS & JS and check for possible improvements? Thanks in advance. Here's a page ...
1
vote
0answers
58 views

Drag to adjust size of two divs

I have a browserify module I've made for resizing two divs I have beside each other. The idea is that I have two panes with a bar between them which I can grab and drag to resize the panes. As one ...
3
votes
1answer
38 views

Place div's of different heights in a responsive parent div

Can somebody help me with optimizing this code? I'd like to have some control about placement. Masonry doesn't do the job in that way. What I have done now is to create some sets of columns. For ...
1
vote
1answer
54 views

“Star Field” Animation with JavaScript and Sass-CSS

I've have make this animation on the weekend as a "just for fun" thing. And for to play with various techniques I've seen in others code. I think it works quite alright. Nevertheless I would ...
1
vote
1answer
81 views

Responsive SASS header

I'm currently working on an header for some homepage. It should be responsive. When enough width is available a floating header is displayed (logo on the left / menu on the right). With less and less ...
3
votes
1answer
58 views

Finding max z-index featuring in the current page

I have to display a cache layer on the whole viewport (to then display a kind of dialog box). Without surprise I create a <div> element with ...
3
votes
1answer
91 views

JavaScript to play and replay CSS animations on load and scroll

The following plays and replays CSS animations on load and scroll. It works but I'm wondering if there is a better way to write this, so it's cleaner and performs better. ...
3
votes
1answer
92 views

“Rasterbation” function to split an image into a grid

I want to create a function that splits an image into many separate blocks that when put together look like the image as a whole, often called a Rasterbator. Given the number of tiles for height and ...
2
votes
1answer
58 views

Opening a navigation

The goal of this function is to open a menu with a CSS class (animation is done through CSS transition), call an overlay on top of content and prevent scrolling at the same time. Also, since the ...
3
votes
0answers
43 views

Javascript menu with dropDown and Slide effects

Over the last couple of weeks we build a huge Javascript menu. And we might think the whole code is a little bit too much. We are not pros, but came to a quit acceptable solution. (yeah it´s German, ...
0
votes
0answers
36 views

Load images embedded in DOM events performantly

if you visit site , you can see page loading time is too much. I am using the below code to display single image, we are using same kind of code for all 16 images, please review code and guide me to ...
0
votes
2answers
65 views

Enable or disable two icons

I need two icons: If the email is verified, show an icon without a hyperlink and set an "activated" CSS class for green style and checked. If the email is not verified, the icon is linked to the ...
2
votes
1answer
108 views

React beginner exercise: Build a base arithmetic calculator

Exercise assignment: Build a calculator with React which can Add, Subtract, Multiply and Divide. See image below for reference Give it whatever design and colors you want Each text field should have ...