vylion/littlelink
vylion/littlelink
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

drop downs click but need fix

Browse source
This commit is contained in:
brian 2022-10-25 01:22:46 -04:00
parent 8e9f727bfe
commit 3605738bf5
3 changed files with 32 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
css/dropdown.css
View file

@ -41,11 +41,4 @@
display: block;
}
/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #ddd;}
/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {display: block;}
/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {background-color: #000001;}
/* removed hover capabilities and added js click capabilities in css/dropdown.js */

20
css/dropdown.js Normal file
View file

@ -0,0 +1,20 @@
function PRlist() {
var click = document.getElementById("PR");
if(click.style.display ==="none") {
click.style.display ="block";
} else {
click.style.display ="none";
}
}
function PLTlist() {
var click = document.getElementById("PLT");
if(click.style.display ==="none") {
click.style.display ="block";
} else {
click.style.display ="none";
}
}
document.getElementById('PR').addEventListener("click", PRlist);
document.getElementById('PLT').addEventListener("click", PLTlist);

28
index.html
View file

@ -36,7 +36,6 @@
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<link rel="stylesheet" href="css/dropdown.css">
<!-- Favicon
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<link rel="icon" type="image/png" href="images/avatar.jng">
@ -107,8 +106,8 @@
-->
<div class="dropdown">
<button class="dropbtn">Professional Resources<img class="icon" src="images/downarrow.png"></button>
<div class="dropdown-content">
<button onclick="PRlist()" class="dropbtn">Professional Resources<img class="icon" src="images/downarrow.png"></button>
<div id="PR" class="dropdown-content">
<!-- Resume -->
<a class="button button-github" href="images/Andrews_Resume_2022.pdf" target="_blank" rel="noopener">
<img class="icon" src="images/icons/resume.png">Resume</a>
@ -133,8 +132,8 @@
<br>
<div class="dropdown">
<button class="dropbtn-PLT"><img class="icon" src="images/icons/PLT.png">Pro Lacrosse Talk<img class="icon" src="images/downarrow.png"></button>
<div class="dropdown-content">
<button onclick="PLTlist()" class="dropbtn-PLT"><img class="icon" src="images/icons/PLT.png">Pro Lacrosse Talk<img class="icon" src="images/downarrow.png"></button>
<div id="PLT" class="dropdown-content">
<!-- Put here spotify links and links to an article or two!
Also change the PLT font color in the drop down field -->
<a class="button button-spotify" href="https://open.spotify.com/show/1wvPf4MiVvv6HY7tIGcdYJ?si=c3a123beab884c64" target="_blank" rel="noopener">
@ -151,18 +150,10 @@
</div>
</div>
<div class="dropdown">
<button class="dropbtn">Contact<img class="icon" src="images/downarrow.png"></button>
<div class="dropdown-content">
<!-- Email -->
<a class="button button-default" target="_blank" rel="noopener">
<img class="icon" src="images/icons/email.svg" alt="Email Icon">b9andrews@gmail.com</a>
<!-- Email Alternative -->
<a class="button button-default" target="_blank" rel="noopener">
<img class="icon" src="images/icons/email.svg" alt="Email Icon">ba553@drexel.edu</a>
</div>
</div>
<!-- Email -->
<a class="button button-default" target="_blank" rel="noopener">
<img class="icon" src="images/icons/email.svg" alt="Email Icon">b9andrews@gmail.com</a>
<br>
<!-- Buy Me a Coffee -->
<a class="button button-coffee" href="https://account.venmo.com/u/Brian-Andrews-9" target="_blank" rel="noopener">
@ -182,6 +173,9 @@
</div>
</div>
<script type="text/javascript" src="css/dropdown.js">
</script>
<!-- End Document
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
</body>