Verlinkung von Quellen ermöglichen.

ew/_layouts/post.html

@@ -12,7 +12,7 @@
          <div class="row">
             <div class="col-lg-10 col-lg-offset-1">
                 {% include post-breadcrumb.html %}
-               {{ content }}
+                    {{ content }}
             </div>
          </div>
       </div>
@@ -20,6 +20,7 @@
 
    {% include footer.html %}
    {% include scripts.html %}
+   <script src="{{ site.baseurl }}/js/sources.js"></script>
 </body>
 
 </html>

ew/_posts/2015-11-12-nachteile-von-responsive-design.markdown

@@ -23,7 +23,7 @@ Gerade bei Tablet-PCs sind heutzutage Bildschirmgrößen erreicht, die denen von
 ### Fazit
 Abschließend lässt sich festhalten, dass Responsive Webdesign Vor- und Nachteile hat. Insbesondere wenn sehr stark auf Responsive Webdesign gesetzt wird, kann es zu Problemen hinsichtlich Erwartungskonformität und Perfomanz kommen.
 
-<hr>
+<hr id="sources">
 
 <small>
     <sup>1</sup> Maisriml, Chio & König, Sabine (2015). [Die Nachteile von Responsive Webdesign](http://beesign.com/themen/responsive-webdesign-nachteile.html). Abgerufen: 07.11.2015.

ew/_sass/_ew.scss

@@ -2,6 +2,10 @@ html {
     overflow-y: scroll;
 }
 
+sup>a:target {
+    background: yellow;
+}
+
 .breadcrumb {
     margin-top: -30px;
     margin-bottom: 30px;

ew/js/sources.js

+/**
+ * Funktionalität für den Klick-Support der Quellenangaben.
+ */
+(function($) {
+    var $sups = $('sup');
+
+    // <sup> durchlaufen und zu Links umwandeln
+    $sups.each(function() {
+        var $el = $(this);
+        var sources = $el.text().split(', ');
+
+        // Links zu #cite_{nr} für jeden <sup> erzeugen
+        sources.forEach(function(source) {
+           $el.after('<sup><a href="#cite_' + source + '">' + source + '</a></sup>');
+           $el.remove();
+        });
+    });
+
+    // <sup>-Links in #sources zu Anchor-Name-Tags umwandeln
+    $('#sources').nextAll('p').find('small>sup').each(function() {
+        var $anchor = $(this).find('a');
+
+        // Name-Attribut anhand des href zusammenbauen.
+        // Alles nach dem Hash verwenden.
+        $anchor.attr(
+            'name',
+            $anchor.attr('href').substring(
+                $anchor.attr('href').indexOf('#') + 1
+            )
+        );
+        $anchor.removeAttr('href');
+    });
+})(jQuery);