97 lines
3.2 KiB
HTML
97 lines
3.2 KiB
HTML
|
<!doctype html>
|
||
|
<html>
|
||
|
<head>
|
||
|
|
||
|
<meta charset="utf-8">
|
||
|
<title>Writings by Shoofle</title>
|
||
|
<script src="/static/jquery.min.js" type="text/javascript"></script>
|
||
|
<link href="/static/bootstrap/css/bootstrap.css" rel="stylesheet" type="text/css">
|
||
|
<link href="/static/bootstrap/css/bootstrap-responsive.css" rel="stylesheet" type="text/css">
|
||
|
<link href="/static/shoofle.css" rel="stylesheet" type="text/css">
|
||
|
|
||
|
</head>
|
||
|
<body>
|
||
|
<article id="tattoo_elements">
|
||
|
<style type="text/css">
|
||
|
#tattoo_elements li { margin-bottom: 1em; }
|
||
|
</style>
|
||
|
<p><a href="http://chemistry.bd.psu.edu/jircitano/periodic4.html">thanks to this site for the images!</a> feel free to suggest other good elements from there.</p>
|
||
|
<ul>
|
||
|
<li><img src="http://chemistry.bd.psu.edu/jircitano/Au.gif" />Gold
|
||
|
<li><img src="http://chemistry.bd.psu.edu/jircitano/Pt.gif" />Platinum
|
||
|
<li><img src="http://chemistry.bd.psu.edu/jircitano/Ag.gif" />Silver
|
||
|
<li><img src="http://chemistry.bd.psu.edu/jircitano/He.gif" />Helium
|
||
|
<li><img src="http://chemistry.bd.psu.edu/jircitano/Li.gif" />Lithium
|
||
|
<li><img src="http://chemistry.bd.psu.edu/jircitano/Be.gif" />Beryllium
|
||
|
<li><img src="http://chemistry.bd.psu.edu/jircitano/Pb.gif" />Lead
|
||
|
<li><img src="http://chemistry.bd.psu.edu/jircitano/Cd.gif" />Cadmium
|
||
|
<li><img src="http://chemistry.bd.psu.edu/jircitano/Si.gif" />Silicon
|
||
|
<li><img src="http://chemistry.bd.psu.edu/jircitano/Ca.gif" />Calcium
|
||
|
</ul>
|
||
|
<p>for use on the results of <a href="http://physics.nist.gov/PhysRefData/ASD/lines_form.html">this atomic spectra database</a>:</p>
|
||
|
<p>CSS:</p>
|
||
|
<pre>
|
||
|
.ac {
|
||
|
background-color: red;
|
||
|
display: inline-block;
|
||
|
width: 1px;
|
||
|
height: 200px;
|
||
|
}
|
||
|
</pre>
|
||
|
<p>javurscript:</p>
|
||
|
<pre>
|
||
|
var jq = document.createElement('script');
|
||
|
jq.src = "http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js";
|
||
|
document.getElementsByTagName('head')[0].appendChild(jq);
|
||
|
</pre>
|
||
|
<p>wait a moment and more javascript:</p>
|
||
|
<pre>
|
||
|
jQuery.noConflict();
|
||
|
$ = jQuery;
|
||
|
|
||
|
var the_table = $($('table')[4]);
|
||
|
|
||
|
function do_stuff(start, end, intensity_cutoff) {
|
||
|
var wavelengths = [];
|
||
|
|
||
|
$(the_table.find('tbody')[1]).find('tr').each(function() {
|
||
|
if ($(this).hasClass('evn') || $(this).hasClass('odd')) { $(this).show(); }
|
||
|
else { $(this).hide(); return true; }
|
||
|
|
||
|
var wavelength_cell = $($(this).find('td')[0]);
|
||
|
var wavelength = parseFloat(wavelength_cell.text());
|
||
|
if (wavelength >= start && wavelength <= end) { $(this).show(); }
|
||
|
else { $(this).hide(); return true;}
|
||
|
|
||
|
var intensity_cell = $($(this).find('td')[2]);
|
||
|
var intensity = parseInt(intensity_cell.text(), 10);
|
||
|
if (intensity >= intensity_cutoff) { $(this).show(); }
|
||
|
else { $(this).hide(); return true;}
|
||
|
|
||
|
wavelengths.push((wavelength - start)/(end - start));
|
||
|
});
|
||
|
return wavelengths;
|
||
|
}
|
||
|
|
||
|
|
||
|
the_table.after($('<div id="shoof-thing"></div>').attr('height', '100px').attr('width', '100%'));
|
||
|
var c = $('#shoof-thing')
|
||
|
|
||
|
|
||
|
function new_thing(x) { return $('<div></div>').addClass('ac').css('margin-left', x); }
|
||
|
|
||
|
|
||
|
var w = do_stuff(380, 760, 9);
|
||
|
var l = w.length;
|
||
|
var o = [];
|
||
|
$.each(w, function(i, v) {
|
||
|
if (i == 0) { o.push("" + (v*95) + "%"); }
|
||
|
else { o.push("" + ((v-w[i-1])*95) + "%"); }
|
||
|
});
|
||
|
c.children().remove();
|
||
|
$.each(o, function(i, v) { c.append(new_thing(v)); });
|
||
|
|
||
|
</pre>
|
||
|
</article>
|
||
|
</body>
|
||
|
</html>
|