You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
143 lines
7.4 KiB
PHTML
143 lines
7.4 KiB
PHTML
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<link href="styles/stylesheet.css" rel="stylesheet" type="text/css">
|
|
<link href="styles/jquery-ui.css" rel="stylesheet" type="text/css">
|
|
|
|
|
|
<!-- <link href="styles/app.css" rel="stylesheet" type="text/css">
|
|
-->
|
|
</head>
|
|
<body>
|
|
<h4 align="right">This is an<span style="font-size:50"> audio zine</span> on amplification of female and collective voices. Author/Narrator: Angeliki Diakrousi</h4>
|
|
<!-- (the unfolding/overlayering of) -->
|
|
|
|
<div class="tab">
|
|
<button class="tablinks" style="position: absolute;font-size: 28px;margin-right: 90%; padding: 8px !important; border: none !important; margin-top: 0% !important;" onclick="openCity(event, 'about')">About</button>
|
|
</div>
|
|
<div id="about" class="tabcontent" style="font-size: 28px !important; left: 5px !important; top: 350px !important; width: 1000px !important;padding: 0px !important;">
|
|
<span onclick="this.parentElement.style.display='none'" class="topleft">×</span>
|
|
|
|
It is a collection of audio recordings coming from meetings I co-organised, internet sources, podcasts and soundwalks. 'Revisiting podcasts' questions the establishment of authoritative/male voices that create exclusive speech platforms, along the assumption that voices have to be rational, authoritative (voice of expertise) etc. The intervention that changes the paradigm becomes <div class="tooltip-wrap" style="display: inline;text-decoration:underline;">a set of podcasts <div class="tooltip-content-right" ><div>what conflicts or frictions the technical aspect provokes?</div></div></div>that revisit the sound material produced in situated amplification meetings and soundwalks. Every podcast includes the previous one, on a way that creates repetetive layers of the same material. Creating presence by repetetion.'Revisiting podcasts' are upsetting binaries such as male/female, expert/amateur, rational/irrational
|
|
</div>
|
|
|
|
<!-- for about -->
|
|
<!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
|
|
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>
|
|
<div style="top: 10px;">
|
|
<a style="font-size: 28px;margin-right: 90%;" href="#" title="It is a collection of audio recordings coming from meetings I co-organised, internet sources, podcasts and soundwalks. 'Revisiting podcasts' questions the establishment of authoritative/male voices that create exclusive speech platforms, along the assumption that voices have to be rational, authoritative (voice of expertise) etc. The intervention that changes the paradigm becomes a set of podcasts that revisit the sound material produced in situated amplification meetings and soundwalks. Every podcast includes the previous one, on a way that creates repetetive layers of the same material. Creating presence by repetetion.'Revisiting podcasts' are upsetting binaries such as male/female, expert/amateur, rational/irrational">About</a></div> -->
|
|
|
|
|
|
<!-- menu -->
|
|
<!-- <div align="left">
|
|
<div class="tooltip-wrap">
|
|
<p style="font-size: 28px;background-color: lightgrey; margin-right: 90%;width: 150px;">Dive into</p>
|
|
<div class="tooltip-content-down" style="font-size: 28px;min-width: 1800px;">
|
|
<div>
|
|
<li class="list" style="border-top: none !important;">
|
|
<a href="podcast1.php" target="_blank">Podcasts <div class="description">AUDIO MOMENTS</div></a>
|
|
|
|
</li>
|
|
<li class="list">
|
|
<a href="texts/thesis/thesis-angeliki.html" target="_blank">Let' s Talk About Unspeakable Things <div class="description">THESIS</div></a>
|
|
|
|
</li>
|
|
<li class="list">
|
|
<a href="amplification.html" target="_blank">Amplification of female voices <div class="description">VOCAL EXERCISES, MEETINGS</div></a>
|
|
</li>
|
|
<li class="list">
|
|
<a href="../Grad_project proposal/1902_describe-soundwalks/West Rotterdam/leeszaal_repetition.html" target="_blank">Diary of West Rotterdam <div class="description">PROCESS, ARCHIVE</div></a>
|
|
|
|
</li>
|
|
<li class="list">
|
|
<a href="player.html" target="_blank">Player <div class="description">ARCHIVE</div></a>
|
|
</li>
|
|
</div>
|
|
</div>
|
|
</div> -->
|
|
|
|
|
|
<div class="tab">
|
|
<button class="tablinks" style="position: absolute;font-size: 28px !important;margin-right: 90%; padding: 8px !important;margin-top: 4% !important;" onclick="openCity(event, 'menu')">Dive Into</button>
|
|
</div>
|
|
<div id="menu" class="tabcontent" style="font-size: 28px !important; left: 5px !important; top: 350px !important; width: 1000px !important;padding: 0px !important;">
|
|
<span onclick="this.parentElement.style.display='none'" class="topleft">×</span>
|
|
<ul>
|
|
<li class="list" style="border-top: none !important;">
|
|
<a href="podcast1.php" target="_blank">Podcasts <div class="description">AUDIO MOMENTS</div></a>
|
|
|
|
</li>
|
|
<li class="list">
|
|
<a href="texts/thesis/thesis-angeliki.html" target="_blank">Let' s Talk About Unspeakable Things <div class="description">THESIS</div></a>
|
|
|
|
</li>
|
|
<li class="list">
|
|
<a href="amplification.html" target="_blank">Amplification of female voices <div class="description">VOCAL EXERCISES, MEETINGS</div></a>
|
|
</li>
|
|
<li class="list">
|
|
<a href="../Grad_project proposal/1902_describe-soundwalks/West Rotterdam/leeszaal_repetition.html" target="_blank">Diary of West Rotterdam <div class="description">PROCESS, ARCHIVE</div></a>
|
|
|
|
</li>
|
|
<li class="list">
|
|
<a href="player.html" target="_blank">Player <div class="description">AUDIO ARCHIVE</div></a>
|
|
</li></ul></div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</section>
|
|
|
|
<div style="position:absolute; top:20%; left:26%;">
|
|
<div class="tooltip-wrap" style="text-decoration:underline;"> <img src="texts/thesis/carson-list.jpg" width="100%"></img><div class="tooltip-content-right" ><div>this is how female/high-pitched voices have been described since acient times as Anne Carson observes</div></div></div>
|
|
</div>
|
|
|
|
<script>
|
|
//This is a naive solution that only handles one tooltip at a time
|
|
//You should really move clicked as a data attribute of the element in question
|
|
var clicked;
|
|
var tooltips = $('a[title]').on('mouseleave focusout mouseover focusin', function(event) {
|
|
if (clicked) {
|
|
event.stopImmediatePropagation();
|
|
}
|
|
}).tooltip().click(function() {
|
|
var $this = $(this);
|
|
var isOpen = $this.data('tooltip');
|
|
var method = isOpen ? 'close' : 'open';
|
|
$this.tooltip(method);
|
|
//verbosity for clarity sake, yes you could just use !isOpen or clicked = (method === 'open')
|
|
if (method === 'open') {
|
|
clicked = true;
|
|
} else {
|
|
clicked = false;
|
|
}
|
|
$this.data('tooltip', !isOpen);
|
|
});
|
|
</script>
|
|
|
|
<!-- scripts for tab button -->
|
|
<script>
|
|
function openCity(evt, cityName) {
|
|
var i, tabcontent, tablinks;
|
|
tabcontent = document.getElementsByClassName("tabcontent");
|
|
for (i = 0; i < tabcontent.length; i++) {
|
|
tabcontent[i].style.display = "none";
|
|
}
|
|
tablinks = document.getElementsByClassName("tablinks");
|
|
for (i = 0; i < tablinks.length; i++) {
|
|
tablinks[i].className = tablinks[i].className.replace(" active", "");
|
|
}
|
|
document.getElementById(cityName).style.display = "block";
|
|
evt.currentTarget.className += " active";
|
|
}
|
|
</script>
|
|
|
|
|
|
</body>
|
|
|
|
</html>
|