View RSS Feed

All Blog Entries

  1. A close button on top of a fluid centered image

    EDIT: see this for an alternative (better?) method..
    CLICK HERE IF YOU WANT TO GO STRAIGHT AWAY TO THE DEMO PAGE.
    The translate() method used inside the HTML-code below moves both a (super) div-containing-a-close-buttom (id: 'the_div') and an image (id: 'the_img') to the center of the window. The jquery-onload in the image ensures that the width of the div equals the width of the image. This is a requirement if we want to get the button (in the div) at the right position in front of ...

    Updated 04-10-2015 at 10:47 PM by molendijk

    Categories
    Uncategorized
  2. IE8 Selectivizr support for Responsive Modal Gallery

    The common factor in all previous versions of the modal gallery is that alternative markup is offered for IE7/8 users to allow them to view image enlargements in a new browser window instead of the modal overlay. This is because those earlier versions of Internet Explorer do not support the CSS :target pseudo selector which triggers the modal overlay, but let's face it - having each image open in a new browser window doesn't do much for usability and it doesn't look very nice either. So, if you're ...

    Updated 01-28-2015 at 12:43 PM by Beverleyh

    Categories
    CSS related , Web Design issues
  3. Using the main scrollbar to scroll an iframe

    If we want to use the browser's scrollbar to scroll the content of an iframe, we must do the following:
    1. calculate iframe's offsetHeight + pixel distance of top of iframe with respect to top of main window + pixel distance of bottom of iframe with respect to bottom of main window ;
    2. give the main window a pixel height that is identical to the result of that calculation;
    3. make sure that the value for the number of pixels that the content of the iframe is scrolled upward (in the case of
    ...
    Categories
    Uncategorized
  4. PHP Stylesheet/Content Switcher with Save Cookie

    Here is a simple PHP script to change stylesheets or load in alternative content (conditional loading), with cookies to store user selection.

    The nice thing about a PHP-based solution over JavaScript content/CSS switchers, is that all the checking and switching is done on the server side, before the web page even finds it's way to the browser, so you don't get any flash of unstyled content. Plus, you can conditionally load HTML or external files (improve performance and save on load ...
  5. Embedding and programmatically controlling multiple YouTube videos

    We can embed and programmatically control multiple YouTube videos by putting onloads like the following in (existing) iframes:
    onload="player1=new YT.Player(this)"
    onload="player2=new YT.Player(this)"

    etc.

    The names for the players (here: player 1 and player2) are arbitrarily chosen. They must be used for selecting the video for which we want to execute javascript (video) code. For instance, player2.playVideo() means that the video associated ...

    Updated 12-07-2014 at 03:15 PM by molendijk

    Categories
    Uncategorized
Page 2 of 21 FirstFirst 123412 ... LastLast