jsFiddle demo - CAS shift hovers

fiddle.css

body { 
    font: 65% "Trebuchet MS", sans-serif; 
    margin: 15px;
}

table, .maincell {
    padding: 5px 0px 0px 0px;
    width: 100%;
}

.leftcell {
    width: 60%;
}

.middlecell {
    width: 20%;
}

.rightcell {
    width: 20%;
}

.bold {
    font-weight: bold;
    padding: 0px 0px 5px 0px;
}

.notes {
    font-style: italic;
    padding: 5px 0px 0px 0px;
}

fiddle.html

<div id="container">
    <header>
    </header>
    <div id="main" role="main">
        <!-- following script defines the jQuery template  -->
        <script id="studentTemplate" type="text/x-jquery-tmpl"> 
            <h3><a href="#">${LName + ", " + FName}</a></h3>
            <div>
                <table>
                    <tr>
                        <td class="leftcell">  
                            <p class="bold"><a href="http://maps.google.com/maps?q=${Lat},${Lon}" target="_blank">${City}, ${State}</a></p>
                            Phone: ${Phone}<br />
                            Fax: ${Fax}<br />
                            Email: <a href="mailto:${Email}">${Email}</a><br />
                            DOB: ${DOB} (Age: ${Age})<br />
                        </td>
                        <td class="middlecell">
                            <p class="bold">Homework</p>
                            ${HW1}<br />
                            ${HW2}<br />
                            ${HW3}<br />
                            ${HW4}<br />
                        </td>
                        <td class="rightcell">
                            <p class="bold">Quizzes</p>
                            ${Quizzes[0]}<br />
                            ${Quizzes[1]}<br />
                            ${Quizzes[2]}<br />
                            ${Quizzes[3]}<br />
                        </td>
                    </tr>
                    <tr>
                        <td colspan="3" class="maincell">
                            <hr />
                            <p class="notes">${Notes}</p>
                        </td>
                    </tr>
                </table>
            </div>
        </script>

        <div id="accordion">
        </div>

    </div>
    <footer>

    </footer>
</div> <!--! end of #container -->

fiddle.js

$(document).ready(function() {

    // ajax call to our gist's response.json file
    $.ajax({        
        url: '/gh/gist/response.json/1649931/',
        dataType: 'json',
        type: 'POST',
        success: function(thestudents, status, jqXHR) {
            // First organize data alphabetically by last name then first name
            thestudents.sort(function(a, b) {
                return (a.LName > b.LName) ? 1 : ((b.LName > a.LName) ? -1 : ((a.FName > b.FName) ? 1 : ((b.FName > a.FName) ? -1 : 0)));
            });

            // loop through the student records, apply each one to our template
            $.each(thestudents, function(i, student) {
                var dob = new Date(),
                    today = new Date(),
                    dates = this.DOB.split("/");
                dob.setFullYear("19" + dates[2], dates[0] - 1, dates[1]);
                this.Age = Math.floor((today.getTime() - dob.getTime()) / (365.25 * 24 * 60 * 60 * 1000));
                $("#studentTemplate").tmpl(student).appendTo("#accordion");
            });
            // apply the accordion
            $("#accordion").accordion({
                header: "h3",
                collapsible: true
            });
        }
    });


});

fiddle.manifest

name: GJSRequest.HTML - jsFiddle/Gist integration demo
description: jsFiddle demo hosted on Gist using HTML Request to get Ajax data
authors:
  - Gary Smith
title:
  - JS Fiddle - jsFiddle/Gist integration demo - students
resources:
  - /js/empty.js
  - /css/normalize.css
  - http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/humanity/jquery-ui.css
  - https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js
  - http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.js
normalize_css: no

...

http://jsfiddle.net/gh/gist/jquery/edge/1657897/