- · 97.934 Slack messages sent
- · Data, data, data (all types, even Soong-type)
- · Wish we lived on Mars, for these extra 41 minutes in every day
- · "If the cell doesn’t like it, the cell doesn’t like it."
- · Breaking into a lab is not a crime (as long as you work there)
- · Thank you "On the Edge" for all the sensational ideas
CharisKomos (Talk | contribs) |
CharisKomos (Talk | contribs) |
||
Line 131: | Line 131: | ||
<circle class='circlez' cx="-230" cy="365" r="135" stroke='#ffffff' stroke-width="0" fill="white" id='c_t1' class='svgGraphic' onclick="displayMe(this.id)" onmouseover="onHoverChanges(this.id)" /> | <circle class='circlez' cx="-230" cy="365" r="135" stroke='#ffffff' stroke-width="0" fill="white" id='c_t1' class='svgGraphic' onclick="displayMe(this.id)" onmouseover="onHoverChanges(this.id)" /> | ||
<text class='animate_text' id='t1' x='0' y='275' text-anchor='middle' fill='#000000'> | <text class='animate_text' id='t1' x='0' y='275' text-anchor='middle' fill='#000000'> | ||
− | <tspan x="-230" dy="2.5em" onclick="displayMe('c_t1')">THE ROAD</tspan> | + | <tspan x="-230" dy="2.5em" onclick="displayMe('c_t1')" id='f_circle_textA'>THE ROAD</tspan> |
− | <tspan x="-230" dy="1.5em" onclick="displayMe('c_t1')">TO</tspan> | + | <tspan x="-230" dy="1.5em" onclick="displayMe('c_t1')" id='f_circle_textB'>TO</tspan> |
− | <tspan x="-230" dy="1.5em" onclick="displayMe('c_t1')">BOSTON</tspan> | + | <tspan x="-230" dy="1.5em" onclick="displayMe('c_t1')" id='f_circle_textC'>BOSTON</tspan> |
</text></a> | </text></a> | ||
Line 139: | Line 139: | ||
<circle class='circlez' cx="190" cy="365" r="135" stroke='#ffffff' stroke-width="0" fill="white" id='c_t2' class='svgGraphic' onclick="displayMe(this.id)" onmouseover="onHoverChanges(this.id)" /> | <circle class='circlez' cx="190" cy="365" r="135" stroke='#ffffff' stroke-width="0" fill="white" id='c_t2' class='svgGraphic' onclick="displayMe(this.id)" onmouseover="onHoverChanges(this.id)" /> | ||
<text class='animate_text' id='t2' x='0' y='335' text-anchor='middle' fill='#000000'> | <text class='animate_text' id='t2' x='0' y='335' text-anchor='middle' fill='#000000'> | ||
− | <tspan x="195" dy="1.5em" onclick="displayMe('c_t2')">MEMBERS</tspan> | + | <tspan x="195" dy="1.5em" onclick="displayMe('c_t2')" id='s_circle_textA'>MEMBERS</tspan> |
</text></a> | </text></a> | ||
Line 145: | Line 145: | ||
<circle class='circlez' cx="610" cy="365" r="135" stroke='#ffffff' stroke-width="0" fill="white" id='c_t3' class='svgGraphic' onclick="displayMe(this.id)" onmouseover="onHoverChanges(this.id)" /> | <circle class='circlez' cx="610" cy="365" r="135" stroke='#ffffff' stroke-width="0" fill="white" id='c_t3' class='svgGraphic' onclick="displayMe(this.id)" onmouseover="onHoverChanges(this.id)" /> | ||
<text class='animate_text' id='t3' x='0' y='335' text-anchor='middle' fill='#000000'> | <text class='animate_text' id='t3' x='0' y='335' text-anchor='middle' fill='#000000'> | ||
− | <tspan x="615" dy="1.5em" onclick="displayMe('c_t3')">SUPERVISORS</tspan> | + | <tspan x="615" dy="1.5em" onclick="displayMe('c_t3')" id='t_circle_textA'>SUPERVISORS</tspan> |
</text></a> | </text></a> | ||
Line 151: | Line 151: | ||
<circle class='circlez' cx="1020" cy="365" r="135" stroke='#ffffff' stroke-width="0" fill="white" id='c_t4' class='svgGraphic' onclick="displayMe(this.id)" onmouseover="onHoverChanges(this.id)" /> | <circle class='circlez' cx="1020" cy="365" r="135" stroke='#ffffff' stroke-width="0" fill="white" id='c_t4' class='svgGraphic' onclick="displayMe(this.id)" onmouseover="onHoverChanges(this.id)" /> | ||
<text class='animate_text' id='t4' x='0' y='335' text-anchor='middle' fill='#000000'> | <text class='animate_text' id='t4' x='0' y='335' text-anchor='middle' fill='#000000'> | ||
− | <tspan x="1025" dy="1.5em" onclick="displayMe('c_t4')">ATTRIBUTIONS</tspan> | + | <tspan x="1025" dy="1.5em" onclick="displayMe('c_t4')" id='fo_circle_textA'>ATTRIBUTIONS</tspan> |
</text></a> | </text></a> | ||
</svg> | </svg> | ||
Line 223: | Line 223: | ||
/* Media Queries in JavaScript using nested if statements */ | /* Media Queries in JavaScript using nested if statements */ | ||
function onWindowResize(){ | function onWindowResize(){ | ||
+ | |||
if(window.innerWidth > 1025){ | if(window.innerWidth > 1025){ | ||
if(window.innerWidth < 1367){ | if(window.innerWidth < 1367){ | ||
− | + | $('#f_circle_textA').attr({ 'x': '-208' }); | |
+ | $('#f_circle_textB').attr({ 'x': '-210' }); | ||
+ | $('#f_circle_textC').attr({ 'x': '-213' }); | ||
− | + | $('#s_circle_textA').attr({ 'x': '200' }); | |
− | + | $('#t_circle_textA').attr({ 'x': '615' }); | |
+ | |||
+ | $('#fo_circle_textB').attr({ 'x': '1020' }); | ||
} | } | ||
} | } | ||
+ | if(window.innerWidth >= 1367){ | ||
+ | $('#f_circle_textA').attr({ 'x': '-230' }); | ||
+ | $('#f_circle_textB').attr({ 'x': '-230' }); | ||
+ | $('#f_circle_textC').attr({ 'x': '-230' }); | ||
+ | |||
+ | $('#s_circle_textA').attr({ 'x': '195' }); | ||
+ | |||
+ | $('#t_circle_textA').attr({ 'x': '615' }); | ||
+ | |||
+ | $('#fo_circle_textB').attr({ 'x': '1025' }); | ||
+ | } | ||
+ | |||
} | } | ||
− | window. | + | $(window).resize(function () { |
onWindowResize(); | onWindowResize(); | ||
}); | }); |
Revision as of 18:27, 22 October 2017