မျက်မှောက်ခေတ်အင်တာနက်ပေါ်တွင်ဝက်ဘ်ဆိုက်များ၏ဒီဇိုင်းနှင့်အပြန်အလှန်အကျိုးသက်ရောက်မှုရှိသောအတွေ့အကြုံသည်အသုံးပြုသူများကိုဆွဲဆောင်ခြင်းနှင့်ထိန်းသိမ်းခြင်းအတွက်အဓိကအချက်များဖြစ်လာသည်။ လိမ္မာပါးနပ်သောကာတွန်းသက်ရောက်မှုများမှတဆင့် 0 က်ဘ်ဆိုက်သည်အသုံးပြုသူများကိုပိုမိုချမ်းသာကြွယ်ဝသောအမြင်အာရုံအတွေ့အကြုံကိုယူဆောင်လာရုံသာမကဝက်ဘ်ဆိုက်၏အပြန်အလှန်အကျိုးသက်ရောက်မှုကိုတိုးတက်စေသည်။ ဤဆောင်းပါးသည်ဘုံကာတွန်းသက်ရောက်မှုအချို့ကိုအကောင်အထည်ဖော်ရန် PHP နှင့် CGI (General Gateway Interface) ကိုမည်သို့အသုံးပြုရမည်ကိုလေ့လာပြီးနမူနာကုဒ်ဖြင့်သရုပ်ပြပါမည်။
Carousel ဓါတ်ပုံများသည်ရုပ်ပုံများသို့မဟုတ်အကြောင်းအရာများစွာကိုပြသနိုင်သည့်ဘုံဝက်ဘ်ကာတွန်းသက်ရောက်မှုများထဲမှတစ်ခုဖြစ်သည်။ PHP နှင့် CGI ကိုအသုံးပြုခြင်းသည်ရိုးရှင်းသောနှင့်ထိရောက်သော carousel အကျိုးသက်ရောက်မှုကိုရရှိနိုင်ပါသည်။
<!DOCTYPE html> <html> <head> <title>carousel ကာတွန်းအကျိုးသက်ရောက်မှု</title> <style> .slideshow-container { position: relative; } .slideshow-container img { display: none; position: absolute; top: 0; left: 0; } </style> </head> <body> <div class="slideshow-container"> <?php $images = array("image1.jpg", "image2.jpg", "image3.jpg"); foreach ($images as $image) { echo "<img src='images/{$image}' alt='ကာငြိုး'> "; } > </div> <script> var slides = document.querySelectorAll(".slideshow-container img"); var currentSlide = 0; function showSlide(n) { slides[currentSlide].style.display = "none"; currentSlide = (n + slides.length) % slides.length; slides[currentSlide].style.display = "block"; } setInterval(function() { showSlide(currentSlide + 1); }, 2000); </script> </body> </html>
ဤကုဒ်တွင်ရုပ်ပုံများပါ 0 င်သောနေရာများကိုပထမ ဦး ဆုံးသတ်မှတ်ပြီး PHP loop မှတဆင့်ပုံအမှတ်အသားများကိုထုတ်ယူသည်။ ထို့နောက် carousel အကျိုးသက်ရောက်မှုကိုထိန်းချုပ်ရန်အတွက် JavaScript ကို အသုံးပြု. `ပုံဖော်တစ်ခုစီကို 2 စက္ကန့်တိုင်းပြောင်းရန်` setrialerval` function ကိုသုံးပါ။
အကြောင်းအရာများကိုပြောင်းလဲရန်လိုအပ်သည့်ဝဘ်စာမျက်နှာများအတွက် PHP နှင့် CGI နည်းပညာများမှတဆင့် 0 ယ်လိုအားကိုတင်ရန် 0 ယ်လိုအားတိုးချဲ့ခြင်းကိုရရှိနိုင်ပါသည်။ ၎င်းသည်စာမျက်နှာပေါ်ရှိကန ဦး ဝန်ကို 0 န်ဆောင်မှုကိုထိထိရောက်ရောက်လျှော့ချနိုင်သည်။
<!DOCTYPE html> <html> <head> <style> #content { width: 400px; height: 200px; overflow: auto; } </style> </head> <div id="content"> <?php for ($i = 1; $i <= 10; $i++) { echo "<p> လိုင်း {$ i} အကြောင်းအရာ</p> "; } > </div> <script> var content = document.getElementById("content"); content.addEventListener("scroll", function() { var scrollTop = content.scrollTop; var scrollHeight = content.scrollHeight; var clientHeight = content.clientHeight; if (scrollTop + clientHeight >= scrollHeight) { // dynamically ပိုပြီးအကြောင်းအရာတင် var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function() { if (xhr.readyState == 4 && xhr.status == 200) { content.innerHTML += xhr.responseText; } }; xhr.open("GET", "load_more.php?start=" + content.scrollHeight, true); xhr.send(); } }); </script> </html>
ဤဥပမာတွင် PHP မှတစ်ဆင့်အကြောင်းအရာ 10 လိုင်းကိုထုတ်ပေးသည်။ အသုံးပြုသူသည်အောက်ခြေသို့ကျမ်းလိပ်ကိုလှည့်သောအခါ JavaScript သည် `scroll` jave လုပ်ခြင်းကိုနားထောင်ပြီးအကြောင်းအရာများပိုမိုများပြားသောအကြောင်းအရာများနှင့် load ကိုတောင်းဆိုရန် XMLHTTHREQUESESE ကိုအသုံးပြုသည်။
PHP နှင့် CGI သည် 0 ဘ်ဆိုဒ်၏အသုံးပြုသူအတွေ့အကြုံနှင့်တက်ကြွမှုကိုသိသိသာသာတိုးမြှင့်ပေးနိုင်သည့် PHP နှင့် CGI တို့တွင် PHP နှင့် CGI တို့တွင်ကိရိယာများစွာပေးသည်။ ဤဆောင်းပါးတွင်မိတ်ဆက်ပေးသော Carousel နှင့် Dynamic Loading Content သည်အကောင်အထည်ဖော်မှုနည်းလမ်းနှစ်ခုသာဖြစ်သည်။ စင်စစ်အားဖြင့် developer များက 0 က်ဘ်ဆိုက်၏ဆွဲဆောင်မှုနှင့်အပြန်အလှန်ဆက်သွယ်မှုများကိုပိုမိုမြှင့်တင်ရန်အတွက် developer များပိုမိုကွဲပြားခြားနားသောကာတွန်းအကျိုးသက်ရောက်မှုများနှင့်အပြန်အလှန်လုပ်ဆောင်မှုများကိုဖန်တီးနိုင်သည်။