Compare commits
No commits in common. "9d1ef8adc4bdd9696644d89da89e4cb8262e7487" and "758636f091c378de9e08a827fc8e927947b6fd25" have entirely different histories.
9d1ef8adc4
...
758636f091
@ -93,49 +93,3 @@ body {
|
||||
color: #333;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
#toggleNav {
|
||||
position: fixed;
|
||||
bottom: 30px;
|
||||
right: 30px;
|
||||
padding: 10px 20px;
|
||||
border: none;
|
||||
border-radius: 25px;
|
||||
background-color: #2196F3;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
#toggleNav:hover {
|
||||
background-color: #1976D2;
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
.number-navigation {
|
||||
position: fixed;
|
||||
bottom: 30px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background-color: rgba(255, 255, 255, 0.9);
|
||||
padding: 15px 25px;
|
||||
border-radius: 50px;
|
||||
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.page-button {
|
||||
padding: 8px 15px;
|
||||
margin: 0 5px;
|
||||
border: none;
|
||||
border-radius: 25px;
|
||||
background-color: #4CAF50;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.page-button.active {
|
||||
background-color: #45a049;
|
||||
transform: scale(1.1);
|
||||
}
|
@ -17,10 +17,5 @@
|
||||
<button onclick="nextPage()">下一页</button>
|
||||
</div>
|
||||
|
||||
<div class="number-navigation" style="display: none;">
|
||||
<div id="pageButtons"></div>
|
||||
</div>
|
||||
|
||||
<button id="toggleNav" onclick="toggleNavigation()">切换导航样式</button>
|
||||
</body>
|
||||
</html>
|
@ -1,7 +1,6 @@
|
||||
let currentPage = 1;
|
||||
let totalPages = 0;
|
||||
let itemsPerPage = 0;
|
||||
let isNumberNavigation = false;
|
||||
|
||||
window.onload = function() {
|
||||
totalPages = parseInt(prompt("请输入要创建的页面数量:", "3"));
|
||||
@ -10,8 +9,6 @@
|
||||
generatePages();
|
||||
showPage(1);
|
||||
updatePageIndicator();
|
||||
generatePageButtons();
|
||||
updateNavigationVisibility();
|
||||
}
|
||||
|
||||
function generatePages() {
|
||||
@ -49,9 +46,6 @@
|
||||
});
|
||||
|
||||
document.getElementById(`page${pageNum}`).classList.add('active');
|
||||
currentPage = pageNum;
|
||||
updatePageIndicator();
|
||||
updateNavigationVisibility();
|
||||
}
|
||||
|
||||
function nextPage() {
|
||||
@ -74,76 +68,3 @@
|
||||
document.getElementById('pageIndicator').textContent =
|
||||
`${currentPage} / ${totalPages}`;
|
||||
}
|
||||
|
||||
function generatePageButtons() {
|
||||
const buttonContainer = document.getElementById('pageButtons');
|
||||
buttonContainer.innerHTML = '';
|
||||
|
||||
// 添加上一页按钮
|
||||
const prevButton = document.createElement('button');
|
||||
prevButton.className = 'page-button prev-button';
|
||||
prevButton.textContent = '上一页';
|
||||
prevButton.onclick = prevPage;
|
||||
buttonContainer.appendChild(prevButton);
|
||||
|
||||
// 添加数字按钮
|
||||
for(let i = 1; i <= totalPages; i++) {
|
||||
const button = document.createElement('button');
|
||||
button.className = 'page-button';
|
||||
button.textContent = i;
|
||||
button.onclick = () => {
|
||||
currentPage = i;
|
||||
showPage(i);
|
||||
updatePageButtons();
|
||||
updatePageIndicator();
|
||||
};
|
||||
buttonContainer.appendChild(button);
|
||||
}
|
||||
|
||||
// 添加下一页按钮
|
||||
const nextButton = document.createElement('button');
|
||||
nextButton.className = 'page-button next-button';
|
||||
nextButton.textContent = '下一页';
|
||||
nextButton.onclick = nextPage;
|
||||
buttonContainer.appendChild(nextButton);
|
||||
|
||||
updatePageButtons();
|
||||
}
|
||||
|
||||
function updatePageButtons() {
|
||||
// 选择除了"上一页"和"下一页"按钮之外的数字按钮
|
||||
const numberButtons = Array.from(document.querySelectorAll('.page-button')).filter(button =>
|
||||
!button.classList.contains('prev-button') &&
|
||||
!button.classList.contains('next-button')
|
||||
);
|
||||
|
||||
numberButtons.forEach(button => {
|
||||
// 将按钮的文本内容转换为数字并与当前页码比较
|
||||
button.classList.toggle('active', parseInt(button.textContent) === currentPage);
|
||||
});
|
||||
}
|
||||
|
||||
function toggleNavigation() {
|
||||
isNumberNavigation = !isNumberNavigation;
|
||||
document.querySelector('.navigation').style.display =
|
||||
isNumberNavigation ? 'none' : 'block';
|
||||
document.querySelector('.number-navigation').style.display =
|
||||
isNumberNavigation ? 'block' : 'none';
|
||||
|
||||
if (isNumberNavigation) {
|
||||
generatePageButtons();
|
||||
}
|
||||
updateNavigationVisibility();
|
||||
}
|
||||
|
||||
function updateNavigationVisibility() {
|
||||
const prevButton = !isNumberNavigation
|
||||
? document.querySelector('.navigation button:first-child')
|
||||
: document.querySelector('.number-navigation .prev-button');
|
||||
const nextButton = !isNumberNavigation
|
||||
? document.querySelector('.navigation button:last-child')
|
||||
: document.querySelector('.number-navigation .next-button');
|
||||
|
||||
prevButton.style.display = currentPage === 1 ? 'none' : 'inline-block';
|
||||
nextButton.style.display = currentPage === totalPages ? 'none' : 'inline-block';
|
||||
}
|
BIN
数据库/实验报告10.docx
BIN
数据库/实验报告10.docx
Binary file not shown.
BIN
数据库/实验报告11.docx
BIN
数据库/实验报告11.docx
Binary file not shown.
BIN
数据库/实验报告12.docx
BIN
数据库/实验报告12.docx
Binary file not shown.
BIN
数据库/实验报告5.docx
BIN
数据库/实验报告5.docx
Binary file not shown.
BIN
数据库/实验报告6.docx
BIN
数据库/实验报告6.docx
Binary file not shown.
BIN
数据库/实验报告7.docx
BIN
数据库/实验报告7.docx
Binary file not shown.
BIN
数据库/实验报告8.docx
BIN
数据库/实验报告8.docx
Binary file not shown.
BIN
数据库/实验报告9.docx
BIN
数据库/实验报告9.docx
Binary file not shown.
Loading…
x
Reference in New Issue
Block a user