Search Results
Searching Chris Hope's blog for "facebox"
The following articles matched your search for "facebox".
There are a total of 25 articles matching this search.
jQuery Facebox dialog with greyed out background
Posted June 27th, 2009 in Javascript (Updated September 22nd, 2009)
Yesterday I posted how to grey out a web page which is useful when showing a Javascript dialog box and in this post show how to do the same when using the jQuery Facebox plugin. The Facebox plugin makes dialog boxes that look like the ones in Facebook.
jQuery's Facebox and Google Maps
Posted February 27th, 2010 in Javascript (Updated March 4th, 2010)
On my soon to be launched New Zealand Running Calendar, I have the location map of the running event on a Google Map. This map can be viewed either on a regular page or via an AJAX call in a jQuery Facebox popup window. However I had issues with the map displaying in the popup as shown in this post along with the solution.
Grey out a webpage
Posted June 26th, 2009 in HTML and CSS and Javascript
When showing an inline popup in a webpage (as opposed to a popup window) it is nice to grey out the background a little to highlight that the user should now interact with the popup rather than the webpage. This post shows how to do the necessary HTML and CSS to achieve this and tomorrow's post will look at implementing the greyed out background with the jQuery Facebox plug-in.
Make jQuery Facebox loading screen auto-center
Posted June 30th, 2009 in Javascript
I've been using the jQuery Facebox dialog plugin in a couple of my projects and one thing that annoys me by default is the loading screen appears at an arbitrary position on the page and then becomes centered after the content has loaded; it's the moving after load I find messy. This post has a simple change that needs to be made to the Facebox code so it auto-centers the loading dialog.
jQuery Plug-ins
Posted December 8th, 2009 in Javascript (Updated May 14th, 2010)
I use a number of jQuery plug-ins and have been posting about how to use some of them recently, and these posts have proved to be quite popular. This post is a summary of my jQuery plugin posts and I'll keep it updated as I add additional articles and howtos for them.
jQuery Facebox dialog with opaque background
Posted September 22nd, 2009 in Javascript
A few months ago I posted how to make the web page behind a jQuery Facebox inline popup grey out using an opaque layer that would show and hide before and after the facebox dialog. A reader recently emailed me to let me know there's an easier way to do this using the undocumented opacity setting which I will show how to do in this post.
healthy.co.nz version 2
Posted October 4th, 2009 in Case Studies
At 2am this morning we finally launched version 2 of the healthy.co.nz website. This has been a long work in the making and replaces the old website which was initially created back in 1998 using the Intershop system and later moved to the e3 system I created at Webenz.
Google Analytics Asynchronous Tracking - Additional Pageviews
Posted April 20th, 2010 in Javascript
Google released asynchronous tracking for Google Analytics earlier this year and I posted an example HTML page showing how to insert the code. On my just released New Zealand Running Calendar website I use jQuery Facebox popups to render a lot of content and wanted those to get tracked as additional pageviews. This post therefore shows how to track additional pageviews when using Google Analytics asynchronous tracking.
New Zealand Running Calendar Goes Live
Posted April 18th, 2010 in Case Studies and SilverStripe
I finally pushed my New Zealand Running Calendar website live this morning directly before going off to run the Run Auckland 10K on the Te Atatu Peninsula (which I ran in 43:31). As with the Motor Home Road Trip website which we pushed live earlier this week there's still a lot of content to be added and once I have all the content loaded I'll be adding some more functionality.
jQuery Facebox Basic Example
Posted May 14th, 2010 in Javascript
The jQuery Facebox plugin creates a Facebook like lightbox which can be used to load external pages, images or put in any content you want. It's not perfect but it works pretty well. This post shows a basic example and the html for a page skeleton which uses Facebox. I'm posting this now because I'll have some additional posts in the next few days using Facebox (and also some older ones here here and here).
RSS Feed
Facebook
Twitter