CSS, short for Cascading Style Sheets, is a language used to control the presentation of HTML and XML documents including colors, layout, and fonts.
1
vote
1answer
23 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
15 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
35 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
42 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
20 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
22 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
14 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
57 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 ...
0
votes
0answers
20 views
“Spinning wheels” - Animated logo with SVG and Sass-CSS
I've made this little animation by using SVG, CSS-keyframes and a bit of Sass.
...
3
votes
0answers
56 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
35 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
55 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
26 views
Place div's of different heights in an responsive parent div optimze and resolve double content
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
40 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
67 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 ...
2
votes
1answer
37 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
51 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
66 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
41 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
35 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
63 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
66 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 ...
3
votes
1answer
94 views
HTML5 Pac-Man game [closed]
I'm testing my game using Firefox, and it's slow whenever it's in fullscreen. If I resize the browser to take up half the screen, it'll scale the image down and run fine. Game also runs fine in Chrome ...
0
votes
0answers
19 views
0
votes
1answer
23 views
File listing layout
I am designing a very basic file listing layout in HTML and CSS. Although its working but I would like to know if the following code could be improved upon so that its more good and follows the best ...
0
votes
1answer
39 views
Bootstrap one page
I've made a simple one page site to practise Bootstrap. Could you please look at HTML & CSS and check for possible improvements? Thanks in advance.
Here's a page.
HTML
...
1
vote
0answers
16 views
Small portfolio project with sliding content
I've done a small portfolio project and I'm looking for some review, especially of:
HTML markup,
CSS/Sass,
animations used,
media queries.
What could been done better? Thanks for help in advance.
...
0
votes
0answers
19 views
LESS lazy mixin for element width/height/float
I have been working with LESS for a few years now and would like to get feedback on some of my mixins. I have a site dedicated to my library, so please let me know if anyone might find this useful.
...
3
votes
1answer
46 views
HTML and CSS template of “Free .psd layout”
I have coded a free .psd layout for the first time. I did not make it responive because I would like to know if the code is correct.
The layout's appearance in Firefox and Chrome seems to be ok (...
11
votes
1answer
90 views
FizzBuzz in CSS
So someone challenged me to write FizzBuzz using CSS only. This was the best I could come up with, but I think the "divisible by 5, not divisible by 3" CSS rule is a bit clunky. So I'm looking for ...
0
votes
0answers
27 views
Group of divs on circle zone
I have created an simple circle zone that have div outside it.
This my code
...
4
votes
0answers
39 views
Toggle menu under specified screen width
I've done simple toggle menu in jQuery which is avaible at specifing breakpoint, but I'm afraid my code is too complicated. How can I make it simplier?
I also have a question about performance of ...
4
votes
2answers
86 views
Get table/rows from database then insert into JavaScript
I'd rather not use this long code. I want to retrieve table/rows from database and insert into JavaScript to create a table in HTML.
This is what it looks like so far and I'd like to keep the design ...
2
votes
1answer
35 views
Filter by vendor-feature with jQuery & Isotope
Task description:
A set of product-thumbnails is shown. The user can filter the shown products by vendor(s). Done by clicking one or multiple buttons.
I used jQuery together with the Isotope-plugin: ...
2
votes
0answers
26 views
Styling different icon positions in boxes with Sass
I've been learning Sass recently and I've made a small project to master key concepts. I've tried to use placeholder to make different styles of boxes. I have a few questions:
is the project ...
1
vote
0answers
83 views
2
votes
1answer
59 views
Tooltip-overlay following the mouse pointer
The purpose is to attach a tooltip-element to arbitrary HTML-elements.
The tooltip appears when the user hovers an element. Follows the mouse-pointer while moving over the element.
...
3
votes
4answers
251 views
CSV parsers and OrderedDictionary
I wrote the following (static) class to read files easily in C#. However, it is a static class, so I wonder if there would be a gain to make it a non static method (and therefore, passing arguments as ...
1
vote
0answers
64 views
CSS flexbox responsive grid system
I'm using the flexbox for the first time for a responsive grid system. It seems to be working as far as I tested but want to make sure it works on others too and see ways to improve this.
Please see <...
2
votes
0answers
53 views
Overall assesment of portfolio website
I've just bought myself a domain and recently created a rough draft of a portfolio website.
A few of my friends have looked over the general design of it and given me some positive feedback so I ...
1
vote
1answer
54 views
One-page quiz web app for teachers
I'm an EFL teacher, and I built this web app to present a random group of questions for quizzes and tests. The page opens with random questions. Clicking anywhere brings up the spinner. Clicking ...
1
vote
1answer
31 views
Showing the current view-position within the web page
I've made this coding for large web pages with lots of text, images etc. If the user scrolls down or up it shows where the current view approximately is. In relation to the overall document height.
I'...
1
vote
1answer
42 views
Add/Remove class on scroll depending on scroll length
I am a jQuery beginner and would like some pointers on whether the following code could be made shorter, or there is a better way to get the same result.
...
5
votes
1answer
115 views
Single-page website
I learned HTML, CSS, JS, and Bootstrap then I grabbed a PSD and tried to code it from scratch (to get experience and something for my currently-non-existent portfolio). Here's the result. I need ...
1
vote
0answers
26 views
“Moving gradient”-animation with CSS-keyframes and Sass
I've made this animation using Sass and CSS-keyframes.
I'm bit worried about my usage of position relative / absolute.
Can one expect that it works in all browser reliable? Or to I have to expect ...
3
votes
1answer
63 views
Ribbon animation code too repetitive
I spent the last two days getting a ribbon animation to work with divs so that I can later add li link elements to them to act as a menu. I used the progess bar animation code as inspiration from ...
1
vote
1answer
41 views
Product information overlaid on a large image
I've created some full-width divs containing images and text to exposure products.
It did take a lot of trial and error (I do not have any kind of education).
However, it feels a bit clumsy and i'm ...
3
votes
1answer
60 views
3
votes
2answers
335 views
JS cross-fade transition
As the question says....Can this be done any better? I could introduce more variables to cut down on function number, but does it make sense? So this is a simple cross-fade between two images :
...