تست: تفاوت میان نسخه‌ها
بدون خلاصۀ ویرایش |
بدون خلاصۀ ویرایش |
||
| خط ۴: | خط ۴: | ||
<meta charset="UTF-8"> | <meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<title>کتابخانه پدیا بایبل - مطالعه آنلاین کتاب‌ها و مقالات مذهبی | <title>کتابخانه پدیا بایبل - مطالعه آنلاین کتاب‌ها و مقالات مذهبی</title> | ||
<meta name="description" content="مطالعه آنلاین | <meta name="description" content="مطالعه آنلاین کتاب عیسی، انجیل متی، مزامیر، پیدایش و مقالات مسیح، تثلیث، نجات و روح القدس در پدیا بایبل"> | ||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | ||
<style> | <style> | ||
* { | /* استایل‌های قبلی شما */ | ||
* { margin: 0; padding: 0; box-sizing: border-box; } | |||
body { font-family: Tahoma, Arial, sans-serif; background-color: #f6f6f6; color: #333; line-height: 1.6; padding: 0; margin: 0; } | |||
.container { max-width: 100%; margin: 0; background: white; padding: 0; } | |||
.header { background: linear-gradient(135deg, #3e6f73, #4a7c59); color: white; padding: 20px 15px; margin-bottom: 15px; text-align: center; } | |||
h1 { margin: 0; font-size: 22px; font-weight: 700; } | |||
body { | .description { color: rgba(255,255,255,0.9); font-size: 13px; margin-top: 8px; line-height: 1.5; } | ||
.container { | |||
.header { | |||
h1 { | |||
} | |||
/* محتوای سئو - قابل مشاهده اما مختصر */ | |||
.seo-intro { | |||
.seo- | |||
background: #fff; | background: #fff; | ||
padding: | padding: 15px; | ||
margin: 0 15px 15px; | margin: 0 15px 15px; | ||
border-radius: 8px; | border-radius: 8px; | ||
border: 1px solid #e9ecef; | border: 1px solid #e9ecef; | ||
text-align: center; | |||
} | } | ||
.seo- | .seo-intro h2 { | ||
color: #3e6f73; | color: #3e6f73; | ||
margin-bottom: | margin-bottom: 10px; | ||
font-size: | font-size: 16px; | ||
} | } | ||
. | .seo-intro p { | ||
font-size: 13px; | font-size: 13px; | ||
color: #666; | color: #666; | ||
margin: | margin-bottom: 10px; | ||
} | } | ||
. | .content-links { | ||
display: flex; | display: flex; | ||
flex-wrap: wrap; | |||
gap: 8px; | |||
justify-content: center; | |||
margin-top: 10px; | |||
margin- | |||
} | } | ||
.content-link { | |||
.content- | |||
background: #f8f9fa; | background: #f8f9fa; | ||
padding: 6px 12px; | |||
border-radius: 4px; | |||
font-size: 12px; | |||
font- | |||
color: #3e6f73; | color: #3e6f73; | ||
text-decoration: none; | |||
border: 1px solid #dee2e6; | border: 1px solid #dee2e6; | ||
transition: all 0.3s ease; | transition: all 0.3s ease; | ||
} | } | ||
. | .content-link:hover { | ||
background: #3e6f73; | background: #3e6f73; | ||
color: white; | color: white; | ||
} | } | ||
. | /* بقیه استایل‌های قبلی شما بدون تغییر */ | ||
.filter-section { margin: 0 15px 15px; background: #f8f9fa; padding: 15px; border: 1px solid #dee2e6; } | |||
.filter-row { display: flex; gap: 10px; margin-bottom: 0; } | |||
} | .form-group { flex: 1; } | ||
label { display: block; margin-bottom: 6px; font-weight: 600; color: #495057; font-size: 13px; } | |||
. | select { width: 100%; padding: 10px 12px; border: 1px solid #ced4da; border-radius: 6px; font-size: 13px; background: white; cursor: pointer; transition: all 0.3s ease; border: 1px solid #e9ecef; } | ||
select:focus { outline: none; border-color: #3e6f73; box-shadow: 0 0 0 2px rgba(62, 111, 115, 0.1); } | |||
} | select:disabled { background-color: #f8f9fa; color: #6c757d; cursor: not-allowed; border-color: #dee2e6; } | ||
.content-frame { margin: 0 15px; border: 1px solid #dee2e6; border-radius: 0; overflow: hidden; background: white; height: calc(100vh - 250px); min-height: 400px; } | |||
.content-header { padding: 12px 15px; background: #f8f9fa; border-bottom: 1px solid #dee2e6; display: flex; justify-content: space-between; align-items: center; } | |||
.content-title { font-weight: 600; color: #3e6f73; font-size: 14px; } | |||
.content-controls { display: flex; gap: 8px; } | |||
.control-btn { background: white; border: 1px solid #dee2e6; border-radius: 4px; padding: 6px 12px; cursor: pointer; font-size: 12px; transition: all 0.3s ease; display: flex; align-items: center; gap: 4px; font-weight: 600; color: #495057; } | |||
.control-btn:hover { background: #3e6f73; color: white; border-color: #3e6f73; } | |||
.iframe-container { width: 100%; height: calc(100% - 50px); position: relative; } | |||
.clean-frame { width: 100%; height: 100%; border: none; background: white; } | |||
.iframe-placeholder { display: flex; align-items: center; justify-content: center; height: 100%; color: #6c757d; font-size: 14px; text-align: center; padding: 20px; background: white; } | |||
.action-buttons { display: flex; justify-content: space-between; align-items: center; padding: 12px 15px; background-color: #f8f9fa; border-top: 1px solid #dee2e6; gap: 8px; } | |||
.wiki-link, .site-link, .view-link { background: #3e6f73; color: white; text-decoration: none; font-weight: 600; padding: 10px 15px; border-radius: 4px; border: none; cursor: pointer; font-size: 13px; text-align: center; flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; transition: all 0.3s ease; } | |||
.site-link { background: #6c757d; } | |||
.view-link { background: #4a7c59; } | |||
.wiki-link:hover, .site-link:hover, .view-link:hover { opacity: 0.9; transform: translateY(-1px); } | |||
.loading-bar { height: 2px; background: linear-gradient(90deg, #8fb996, #3e6f73); width: 0%; transition: width 0.4s ease; position: absolute; top: 0; right: 0; } | |||
@media (max-width: 768px) { | @media (max-width: 768px) { | ||
.filter-row { | .filter-row { flex-direction: column; } | ||
.content-frame { height: calc(100vh - 280px); min-height: 350px; } | |||
.action-buttons { flex-direction: column; } | |||
.wiki-link, .site-link, .view-link { width: 100%; } | |||
.content-frame { | .content-header { flex-direction: column; gap: 8px; align-items: flex-start; } | ||
.content-controls { width: 100%; justify-content: space-between; } | |||
.header { padding: 15px 10px; } | |||
h1 { font-size: 20px; } | |||
.description { font-size: 12px; } | |||
.action-buttons { | .content-links { justify-content: flex-start; } | ||
.wiki-link, .site-link, .view-link { | |||
.content-header { | |||
.content-controls { | |||
.header { | |||
h1 { | |||
.description { | |||
.content- | |||
} | } | ||
</style> | </style> | ||
</head> | </head> | ||
<body> | <body> | ||
<div class="container"> | <div class="container"> | ||
<header class="header"> | <header class="header"> | ||
| خط ۴۷۱: | خط ۱۰۹: | ||
</header> | </header> | ||
<!-- محتوای سئو --> | <!-- محتوای مختصر سئو --> | ||
<section class="seo- | <section class="seo-intro"> | ||
<h2>کتابخانه | <h2>منابع قابل مطالعه در کتابخانه</h2> | ||
<p> | <p>کتاب‌های مقدس و مقالات تخصصی مذهبی برای مطالعه آنلاین</p> | ||
<div class="content- | <div class="content-links"> | ||
< | <a href="#عیسی" class="content-link" onclick="selectContent('عیسی')">کتاب عیسی</a> | ||
<a href="#انجیل-متی" class="content-link" onclick="selectContent('انجیل_متی')">انجیل متی</a> | |||
<a href="#مزامیر" class="content-link" onclick="selectContent('مزامیر')">مزامیر</a> | |||
< | <a href="#پیدایش" class="content-link" onclick="selectContent('پیدایش')">پیدایش</a> | ||
<a href="#مسیح" class="content-link" onclick="selectContent('مسیح')">مقاله مسیح</a> | |||
<a href="#تثلیث" class="content-link" onclick="selectContent('تثلیث')">مقاله تثلیث</a> | |||
<a href="#نجات" class="content-link" onclick="selectContent('نجات')">مقاله نجات</a> | |||
< | <a href="#روح-القدس" class="content-link" onclick="selectContent('روح_القدس')">مقاله روح القدس</a> | ||
< | |||
</div> | </div> | ||
</section> | </section> | ||
| خط ۵۸۵: | خط ۲۱۵: | ||
let currentZoom = 100; | let currentZoom = 100; | ||
let currentContent = ''; | let currentContent = ''; | ||
// تابع برای انتخاب مستقیم محتوا از لینک‌ها | |||
function selectContent(contentValue) { | |||
// پیدا کردن دسته‌بندی محتوا | |||
let category = ''; | |||
let contentText = ''; | |||
for (const [cat, items] of Object.entries(booksData)) { | |||
const item = items.find(item => item.value === contentValue); | |||
if (item) { | |||
category = cat; | |||
contentText = item.text; | |||
break; | |||
} | |||
} | |||
if (category && contentText) { | |||
// تنظیم دسته‌بندی | |||
categorySelect.value = category; | |||
// پر کردن لیست محتواها | |||
contentSelect.disabled = false; | |||
contentSelect.innerHTML = '<option value="">لطفاً محتوا انتخاب کنید</option>'; | |||
booksData[category].forEach(item => { | |||
const option = document.createElement('option'); | |||
option.value = item.value; | |||
option.textContent = item.text; | |||
if (item.value === contentValue) option.selected = true; | |||
contentSelect.appendChild(option); | |||
}); | |||
currentContent = contentValue; | |||
showContent(contentValue, contentText); | |||
} | |||
} | |||
// وقتی دسته‌بندی تغییر کرد | // وقتی دسته‌بندی تغییر کرد | ||
| خط ۷۳۴: | خط ۴۰۰: | ||
loadingBar.style.width = '0%'; | loadingBar.style.width = '0%'; | ||
} | } | ||
// بررسی هش در URL برای لود مستقیم محتوا | |||
window.addEventListener('load', function() { | |||
const hash = window.location.hash.substring(1); | |||
if (hash) { | |||
const contentMap = { | |||
'عیسی': 'عیسی', | |||
'انجیل-متی': 'انجیل_متی', | |||
'مزامیر': 'مزامیر', | |||
'پیدایش': 'پیدایش', | |||
'مسیح': 'مسیح', | |||
'تثلیث': 'تثلیث', | |||
'نجات': 'نجات', | |||
'روح-القدس': 'روح_القدس' | |||
}; | |||
if (contentMap[hash]) { | |||
setTimeout(() => selectContent(contentMap[hash]), 500); | |||
} | |||
} | |||
}); | |||
</script> | </script> | ||
</body> | </body> | ||
</html> | </html> | ||
نسخهٔ ۱۲ اکتبر ۲۰۲۵، ساعت ۲۳:۰۱
<!DOCTYPE html>
کتابخانه پدیا بایبل
مطالعه آنلاین کتاب‌ها و مقالات مذهبی شامل کتاب‌های مقدس و مقالات تخصصی
منابع قابل مطالعه در کتابخانه
کتاب‌های مقدس و مقالات تخصصی مذهبی برای مطالعه آنلاین
هیچ محتوایی انتخاب نشده است
لطفاً یک کتاب یا مقاله از لیست انتخاب کنید