============= Code Snippets ============= Customize shifting mode _______________________ .. code-block:: javascript :linenos: var pq3d = new PhotoQueue(el, { shiftMode:'spiralUp', shiftingDistance:400, itemDistance:300 }); 2D Mode ________ .. code-block:: javascript :linenos: var pq3d = new PhotoQueue(el, { useFullscreen:false, force2d:true, gal2d:{ maxScale:0.75, distance:300 } }); Enable Mouse Dragging _____________________ .. code-block:: javascript :linenos: var pq3d = new PhotoQueue(el, { useMouseDrag:true }); Enable Mouse Camera _____________________ .. code-block:: javascript :linenos: var pq3d = new PhotoQueue(el, { mouseCam:true }); Enable Auto play _________________ .. code-block:: javascript :linenos: var pq3d = new PhotoQueue(el, { useAutoplay:true }); Enable Looping _________________ .. code-block:: javascript :linenos: var pq3d = new PhotoQueue(el, { loop:true }); Change general container size _____________________________ .. code-block:: javascript :linenos: var pq3d = new PhotoQueue(el, { mediaviewer:{ containerWidth:500, containerHeight:300 } }); Custom AJAX processing _____________________ .. code-block:: javascript :linenos: var pq3d = new PhotoQueue(el, { mediaviewer:{ ajaxProcessor:function(con, req) { con.innerHTML = req.responseText; } } }); Full Width __________ .. code-block:: css :linenos: <style> .rs-pq3d { width:100%; } </style> Add event handlers __________________ .. code-block:: javascript :linenos: pq3d.addEventListener('target', function(e) { console.log(e.detail); }); pq3d.addEventListener('cload', function(e) { console.log(e.detail); }); pq3d.addEventListener('cloadcomplete', function(e) { console.log(e.detail); }); Create distributions ____________________ .. code-block:: html grunt dist Build example files ___________________ .. code-block:: html grunt examples Compile pug templates _____________________ .. code-block:: html grunt pug Compile SASS _____________ .. code-block:: html grunt compass Watch files for changes _______________________ .. code-block:: html grunt watch