17
17
< body >
18
18
< link rel ="stylesheet " href ="../../DepartmentMain.css " type ="text/css ">
19
19
< script src ="../../../loadheader.js "> </ script >
20
-
21
20
< section class ="section computer-department " data-section ="computer-department ">
22
21
< div class ="container ">
23
22
< div class ="row ">
@@ -29,13 +28,65 @@ <h2>Model Answers</h2>
29
28
</ div >
30
29
</ div >
31
30
</ section >
32
- < div class ="container-data ">
31
+ < nav class ="navbar " style ="margin-top: -60px; ">
32
+ < div class ="container " style ="width: 90%; ">
33
+ < button class ="btn btn-outline-light " onclick ="scrollToSemester('semester1') "> Semester 1</ button >
34
+ < button class ="btn btn-outline-light " onclick ="scrollToSemester('semester2') "> Semester 2</ button >
35
+ < button class ="btn btn-outline-light " onclick ="scrollToSemester('semester3') "> Semester 3</ button >
36
+ < button class ="btn btn-outline-light " onclick ="scrollToSemester('semester4') "> Semester 4</ button >
37
+ < button class ="btn btn-outline-light " onclick ="scrollToSemester('semester5') "> Semester 5</ button >
38
+ < button class ="btn btn-outline-light " onclick ="scrollToSemester('semester6') "> Semester 6</ button >
39
+ </ div >
40
+ </ nav >
41
+ < hr >
42
+ < div class ="container-data " id ="semester1 ">
33
43
< div class ="card-data ">
34
44
< div class ="main-content ">
35
45
< p class ="heading "> Semester 1</ p >
36
- < hr >
46
+ < table class ="data-table ">
47
+ < tr >
48
+ < td class ="td1 "> Item 1</ td >
49
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
50
+ </ tr >
51
+ < tr >
52
+ < td class ="td1 "> Item 2</ td >
53
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
54
+ </ tr >
55
+ < tr >
56
+ < td class ="td1 "> Item 2</ td >
57
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
58
+ </ tr >
59
+ < tr >
60
+ < td class ="td1 "> Item 2</ td >
61
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
62
+ </ tr >
63
+ < tr >
64
+ < td class ="td1 "> Item 2</ td >
65
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
66
+ </ tr >
67
+ <!-- Add more rows as needed -->
68
+ </ table >
69
+ </ div >
70
+ </ div >
71
+ </ div >
72
+ < div class ="container-data " id ="semester2 ">
73
+ < div class ="card-data ">
74
+ < div class ="main-content ">
75
+ < p class ="heading "> Semester 2</ p >
37
76
< table class ="data-table ">
38
77
< tr >
78
+ < td class ="td1 "> Item 2</ td >
79
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
80
+ </ tr >
81
+ < tr >
82
+ < td class ="td1 "> Item 2</ td >
83
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
84
+ </ tr >
85
+ < tr >
86
+ < td class ="td1 "> Item 2</ td >
87
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
88
+ </ tr >
89
+ < tr >
39
90
< td class ="td1 "> Item 1</ td >
40
91
< td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
41
92
</ tr >
@@ -50,11 +101,98 @@ <h2>Model Answers</h2>
50
101
<!-- Add more rows as needed -->
51
102
</ table >
52
103
</ div >
53
- </ div >
104
+ </ div >
105
+ </ div >
106
+ < div class ="container-data " id ="semester3 ">
107
+ < div class ="card-data ">
108
+ < div class ="main-content ">
109
+ < p class ="heading "> Semester 3</ p >
110
+ < table class ="data-table ">
111
+ < tr >
112
+ < td class ="td1 "> Item 1</ td >
113
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
114
+ </ tr >
115
+ < tr >
116
+ < td class ="td1 "> Item 2</ td >
117
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
118
+ </ tr >
119
+ < tr >
120
+ < td class ="td1 "> Item 2</ td >
121
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
122
+ </ tr >
123
+ <!-- Add more rows as needed -->
124
+ </ table >
125
+ </ div >
126
+ </ div >
127
+ </ div >
128
+ < div class ="container-data " id ="semester4 ">
129
+ < div class ="card-data ">
130
+ < div class ="main-content ">
131
+ < p class ="heading "> Semester 4</ p >
132
+ < table class ="data-table ">
133
+ < tr >
134
+ < td class ="td1 "> Item 1</ td >
135
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
136
+ </ tr >
137
+ < tr >
138
+ < td class ="td1 "> Item 2</ td >
139
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
140
+ </ tr >
141
+ < tr >
142
+ < td class ="td1 "> Item 2</ td >
143
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
144
+ </ tr >
145
+ <!-- Add more rows as needed -->
146
+ </ table >
147
+ </ div >
148
+ </ div >
149
+ </ div >
150
+ < div class ="container-data "id ="semester5 ">
151
+ < div class ="card-data ">
152
+ < div class ="main-content ">
153
+ < p class ="heading "> Semester 5</ p >
154
+ < table class ="data-table ">
155
+ < tr >
156
+ < td class ="td1 "> Item 1</ td >
157
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
158
+ </ tr >
159
+ < tr >
160
+ < td class ="td1 "> Item 2</ td >
161
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
162
+ </ tr >
163
+ < tr >
164
+ < td class ="td1 "> Item 2</ td >
165
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
166
+ </ tr >
167
+ <!-- Add more rows as needed -->
168
+ </ table >
169
+ </ div >
170
+ </ div >
171
+ </ div >
172
+ < div class ="container-data "id ="semester6 ">
173
+ < div class ="card-data ">
174
+ < div class ="main-content ">
175
+ < p class ="heading "> Semester 6</ p >
176
+ < table class ="data-table ">
177
+ < tr >
178
+ < td class ="td1 "> Item 1</ td >
179
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
180
+ </ tr >
181
+ < tr >
182
+ < td class ="td1 "> Item 2</ td >
183
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
184
+ </ tr >
185
+ < tr >
186
+ < td class ="td1 "> Item 2</ td >
187
+ < td class ="td1 "> < a href ="# "> < span class ="select-link "> Download </ span > </ a > </ td >
188
+ </ tr >
189
+ <!-- Add more rows as needed -->
190
+ </ table >
191
+ </ div >
192
+ </ div >
54
193
</ div >
55
194
56
-
57
-
195
+
58
196
< script src ="../../../loadfooter.js "> </ script >
59
197
</ body >
60
198
<!-- Include your footer and scripts -->
@@ -72,5 +210,17 @@ <h2>Model Answers</h2>
72
210
73
211
<!-- This place i have called the footer -->
74
212
213
+ < script >
214
+ function scrollToSemester ( semesterId ) {
215
+ var element = document . getElementById ( semesterId ) ;
216
+ var offset = element . getBoundingClientRect ( ) . top ;
217
+ var navbarHeight = document . querySelector ( '.navbar' ) . offsetHeight ;
218
+ var windowHeight = window . innerHeight ;
219
+ window . scrollTo ( {
220
+ top : window . pageYOffset + offset - navbarHeight - ( windowHeight / 2 ) ,
221
+ behavior : 'smooth'
222
+ } ) ;
223
+ }
224
+ </ script >
75
225
76
226
</ html >
0 commit comments