Widget:Frontpagegallery3: Difference between revisions

← Older edit

Latest revision as of 06:22, 16 April 2015

This widget displays a gallery of images for the main page.

@@ Line 1: / Line 1: @@
+<noinclude>This widget displays a gallery of images for the main page.
+<center>{{#Widget:Frontpagegallery3}}</center>
+</noinclude><includeonly>
+<!--Widget:Frontpagegallery-->
+<style type="text/css">
+#myGallery { }
+/* GALLERY CONTAINER */
+.gallery { background: #888f88; border: 0px solid #aaa; padding: 0px;}
+/* LOADING BOX */
+.loader { background: url(loader.gif) center center no-repeat #000; }
+/* GALLERY PANELS */
+.panel {}
+/* DEFINE HEIGHT OF PANEL OVERLAY */
+/* NOTE - It is best to define padding here as well so overlay and background retain identical dimensions */
+.panel .panel-overlay,
+.panel .overlay-background { height: 55px; padding: 0 1em; }
+/* PANEL OVERLAY BACKGROUND */
+.panel .overlay-background { background: #000; }
+/* PANEL OVERLAY CONTENT */
+.panel .panel-overlay { text-align: left; color: white; font-size: 1em; }
+.panel .panel-overlay a { text-align: left; color: #87d5fd; font-size: 1.2em; text-decoration: none; font-weight: bold; }
+/* FILMSTRIP */
+/* 'margin' will define top/bottom margin in completed gallery */
+.filmstrip {display:block;}
+/* FILMSTRIP FRAMES (contains both images and captions) */
+.frame { background: #000;}
+/* WRAPPER FOR FILMSTRIP IMAGES */
+.frame .img_wrap { border: 1px solid #aaa; }
+/* WRAPPER FOR CURRENT FILMSTRIP IMAGE */
+.frame.current .img_wrap { border-color: #fff; }
+/* FRAME IMAGES */
+.frame img { border: 1px #fff; }
+/* FRAME CAPTION */
+.frame .caption { font-size: 11px; text-align: center; color: #888; }
+/* CURRENT FRAME CAPTION */
+.frame.current .caption { color: #ddd; }
+/* POINTER FOR CURRENT FRAME */
+.pointer {
+	border-color: #fff;
+}
+/* TRANSPARENT BORDER FIX FOR IE6 */
+/* NOTE - DO NOT CHANGE THIS RULE */
+*html .pointer {
+	filter: chroma(color=pink);
+}
+</style>
+<script type="text/javascript" src="/mediawiki/skins/CsdmsSkin18/GalleryView-3.0/js/jquery.easing.1.3.js"></script>
+<script type="text/javascript" src="/mediawiki/skins/CsdmsSkin18/GalleryView-3.0/js/jquery.galleryview-3.0-dev.js"></script>
+<script type="text/javascript" src="/mediawiki/skins/CsdmsSkin18/GalleryView-3.0/js/jquery.timers-1.2.js"></script>
+<link type="text/css" rel="stylesheet" href="/mediawiki/skins/CsdmsSkin18/GalleryView-3.0/css/jquery.galleryview-3.0-dev.css" />
+<script type="text/javascript">
+	$(function(){
+		$('#myGallery').galleryView({
+                          panel_width: 676,
+                          panel_height: 312,
+                          infobar_opacity: 1.0,
+                          show_captions: false,
+                          show_panel_nav: true,
+                          enable_overlays: true,
+                          show_filmstrip_nav: false,
+                          autoplay: true,
+                          filmstrip_style: 'showall',
+                          filmstrip_position: 'top',
+                          panel_animation: 'crossfade',
+                          frame_opacity: 0.4,
+                          frame_gap: 2,
+                          show_infobar: false,
+		});
+	});
+</script>
+<ul id="myGallery">
+<!--Meeting 2015-->
+     <li><img src='/mediawiki/images/Frontpage_meeting_madeby_TEDxBoulder.jpg' title='<a href="/wiki/Form:CSDMS_annual_meeting">CSDMS 2015 Annual Meeting: Models meet Data, Data meet Models</a>' data-description="When: May 26-28, 2015; where: Boulder CO; Registration is closed"/>
+    </li>
+<!-- SOS EKT-->
+    <li><img src='/mediawiki/images/SOS_frontpage.png' title='<a href="/wiki/Science_on_a_Sphere">CSDMS brings Science to a Sphere</a>' data-description="Model simulations are now available in many musea around the world." />
+    </li>
+<!--WMT modeling Tool-->
+    <li><img src='/mediawiki/images/WMT_frontpage3.png' title='<a href="/wiki/WMT_information">CSDMS Web Modeling Tool (WMT)</a>' data-description="CSDMS has developed a user friendly web interface (WMT) to couple and run modules. Click here to find out more...." />
+    </li>
+<!--Standard-names-->
+    <li><img src='/mediawiki/images/Standard-names.png' title='<a href="/wiki/CSDMS_Standard_Names">CSDMS Standard Names</a>' data-description="Mapping input and output variable names to CSDMS Standard Names in your source code" />
+    </li>
+<!--Wordle for DOI-->
+     <li><img src='/mediawiki/images/Wordle-DOI.png' title='<a href="/wiki/DOI_system_for_models">DOI for models</a>' data-description="Models in the CSDMS repository now have their own digital identifier" />
+    </li>
+<!--beach CSDMS HPC cluster-->
+    <li><img src='/mediawiki/images/Beach2a_(ippei_+_janine_Creative_commons_license_Flickr).jpg' title='<a href="/wiki/Help:CSDMS_HPCC">High Performance Computing Cluster (Code name: beach)</a>' data-description="CSDMS High Performance Computing Cluster (Beach) is freely available for CSDMS members." />
+    </li>
+    </ul>
+</includeonly>