codeup-web-exercises/jquery_faq.html at main · jimmywardmichael/codeup-web-exercises · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>jQuery Attributes Exercise</title>
  <style>
    .invisible{
      visibility: hidden;
    }
    .not-invisible{
      visibility: visible;
    }
  </style>
</head>
<body>
<h1>10 FAQs about National Parks</h1>
<a class="toggle-link" href="#"> Toggle Descriptions </a>

<dl>
  <dt>1. Who is the director of the National Park Service?</dt>
  <dd class="invisible" >Charles F. "Chuck" Sams III is the Director of the National Park Service.</dd>

  <dt>2. What government agency oversees the National Park Service?</dt>
  <dd class="invisible" >The National Park Service is a bureau of the Department of the Interior. Directly overseeing its operation is the department's Assistant Secretary for Fish, Wildlife and Parks.</dd>

  <dt>3.How many employees are in the National Park Service?</dt>
  <dd class="invisible">Permanent, temporary, and seasonal employees: Approximately 20,000</dd>

  <dt>4. How old is the National Park System?</dt>
  <dd class="invisible">The National Park Service was created by an act signed by President Woodrow Wilson on August 25, 1916. Yellowstone National Park was established by an act signed by President Ulysses S. Grant on March 1, 1872, as the nation's first national park. View the National Park System timeline.</dd>

  <dt>5. What is the origin of the National Park Service arrowhead?
  </dt>
  <dd class="invisible" >The arrowhead was authorized as the official National Park Service emblem by the Secretary of the Interior on July 20, 1951. The components of the arrowhead may have been inspired by key attributes of the National Park System, with the sequoia tree and bison representing vegetation and wildlife, the mountains and water representing scenic and recreational values, and the arrowhead itself representing historical and archeological values. Read more about the history of the arrowhead and other elements of NPS visual design.
  </dd>

  <dt>6. How many areas are in the National Park System?</dt>
  <dd class="invisible" >The system includes 423 areas covering more than 85 million acres in every state, the District of Columbia, American Samoa, Guam, Puerto Rico, and the Virgin Islands. These areas include national parks, monuments, battlefields, military parks, historical parks, historic sites, lakeshores, seashores, recreation areas, scenic rivers and trails, and the White House. Learn more about national park designations. See the complete list of National Park Service units and related areas by type and number.</dd>

  <dt>7. What is the largest national park site? Smallest?
  </dt>
  <dd class="invisible">Largest: Wrangell-St. Elias National Park and Preserve, AK, at 13.2 million acres
    Smallest: Thaddeus Kosciuszko National Memorial, PA, at 0.02 acres</dd>

  <dt>8. How many people visit the national parks?
  </dt>
  <dd class="invisible">Total recreation visitors to the national parks in 2021: 297,115,406.
  </dd>

  <dt>9. What is the most-visited national park?
  </dt>
  <dd class="invisible">Great Smoky Mountains National Park</dd>

  <dt>10. What is the National Park Service budget?
  </dt>
  <dd class="invisible" >Fiscal Year (FY) 2014 Enacted: $2.98 billion
    FY 2015 Enacted: $2.615 billion
    FY 2016 Enacted:$2.851 billion
    FY 2017 Enacted: $2.932 billion
  </dd>
</dl>

<button type="button">Highlight last li</button>

<h3 >Arcadia National Park</h3>
<ul>
  <li>Located in Maine</li>
  <li>Has Trees</li>
  <li>Has Trails</li>
  <li>Has Water</li>
</ul>
<h3>Zion National Park</h3>
<ul>
  <li>Located in Utah</li>
  <li>Has Trees</li>
  <li>Has Trails</li>
  <li>Has Water</li>
</ul>
<h3>Yosemite National Park</h3>
<ul>
  <li>Located in California</li>
  <li>Has Trees</li>
  <li>Has Trails</li>
  <li>Has Water</li>
</ul>


<script src="https://code.jquery.com/jquery-3.6.1.min.js" integrity="sha256-o88AwQnZB+VDvE9tvIXrMQaPlFFSUTR+nldQm1LuPXQ=" crossorigin="anonymous"></script>

<script>

  $('.toggle-link').click(function(event){
    event.preventDefault();
    $('dd').toggleClass('invisible');
  })

  //bonus
  $('dt').click(function(event){
    $(this).css('background-color', 'yellow');
  })
  $('h3').click(function(){
    $(this).next().css('font-weight', 'bold');
    //console.log($(this).next());
  })

  $('li').click(function(){
    $(this).parent().children().first().css('color', 'blue');
    //console.log($(this).next());
  })

  $('button').click(function(event){
    event.preventDefault();
    $('ul').each(function(){
      $(this).children().last().css('background-color', 'yellow');
    });
  })


</script>


</body>
</html>

<!--///credit from ///https://www.travel-experience-live.com/frequently-asked-questions-national-parks-->