View RSS Feed

All Blog Entries

  1. The Easy Way to Absolute Center (vertical + horizontal alignment)

    I hit a snag recently when I wanted to absolutely center a responsive image and couldn't use my 'go-to' method of CSS3 transforms, due to other conflicting CSS3 keyframe animations that were cancelling it out;
    Code:
    img { 
    	max-width: 100%; 
    	max-height: 100%; 
    	position: absolute; 
    	top: 50%; 
    	left: 50%; 
    	-webkit-transform: translate(-50%,-50%);
    	-ms-transform: translate(-50%,-50%);
    	transform: translate(-50%,-50%)
    }
    Here's ...

    Updated Yesterday at 07:23 AM by Beverleyh

    Categories
    CSS related , Web Design issues
  2. Using the Google Document Viewer for embedding PDF / opening it in a new window/ tab

    Often PDF-files will not open in Internet Explorer if we just use the regular PDF-URL in the address bar or for the iframe in which we want to embed the file. And often PDF-files are not readable on iOS, or only display the first page of the document.
    These problems don't seem to occur if we use the Google Document Viewer for displaying PDF. Here's some useful code for using the viewer. Its only disadvantage is that it does not allow momentum scroll on iOS.

    Updated 05-23-2016 at 09:19 AM by molendijk (English)

    Categories
    Uncategorized
  3. SlideUp / SlideDown content without jQuery (VelocityJS)

    The SlideUp/SlideDown methods in jQuery are said to be the "Holy Grail" of vertical animations, because they are able to (reasonably) smoothly change the height of a matched element with a sliding motion, while allowing sibling elements to move in to the empty space. If you're unsure of what I mean, take a look at this jQuery-powered Q&A/FAQs script I cobbled together, and watch how the pretty-coloured bars move to leave no gaps, when other boxes are opened and closed;

    ...
  4. Another Youtube Gallery

    I know there's an excellent YouTube Video Gallery on DD. But I wanted a gallery that
    - shows the videos inside the box containing the thumbnails for the videos, giving them the dimensions of the box;
    - allows the videos to also be shown at full window size (maximize and minimize buttons for the videos);
    - removes the Youtube ads;
    - makes it possible to put text at the top of the thumbnails and at the top of the videos themselves.

    So I made a gallery myself. ...
    Categories
    Uncategorized
  5. Content Filter + Refine with Multi-Category Select (show selected or hide selected)

    Back in September last year, I wrote about making a content filter where items are filtered by class. A big limitation to this script is that it uses radio buttons to make selections, and as we all know, only one radio button can be selected at any time.

    I decided to revisit the content filter, adding 'refine' functionality, so that multi-category selections can be made. A welcome refinement, and much more usable in the real world for sure.

    First I should draw your ...
Page 1 of 25 12311 ... LastLast