map.js

/**
 * @author MatthewBaker
 * 
 * Requires the style
 * 
 *             .custom-marker {
                pointer-events: all;
                position:absolute;
                width:20px;
                height:20px;
            }
            
            added to the CSS
 */

function loadInit() {

  mapbox.load('openingofdetroit.map-wlpt10au', function(o) {
		var map = mapbox.map('map');
		map.addLayer(o.layer).zoom(12).center({
			lat : 42.35584353484354,
			lon : -83.04361291891475
		});

		var markers = mapbox.markers.layer().url('OOD_Voices.geojson').factory(function(feature) {
            var div = document.createElement('div');
            div.className = 'custom-marker';
            var img = div.appendChild(document.createElement('img'));
            img.src = 'http://dummyimage.com/20x20/bd00bd/fff';
            return div;
        });
		mapbox.markers.interaction(markers).formatter(function(feature) {
            var div = document.createElement('div');
            var title = div.appendChild(document.createElement('h1'));
            title.innerHTML = feature.properties["What's you"];
            return div;
        });
		map.addLayer(markers);

		map.ui.hash.add();
		map.ui.zoomer.add();
		map.ui.zoombox.add();
		map.interaction.auto();
	});
}