حذف صفحه لودینگ بعد از لود کامل صفحه

درود
https://www.w3schools.com/howto/howto_css_loader.asp
حتما به مستندات تیلوند سر بزن

@error.404
نحوه ساخت لودر رو گفته این لینک...
اوکی ممنون

@mehdi8686h
الان مشکلی هست؟
اگه مشکلی هست بپرسید

@error.404
فکر نکنم کد js لودر تو داکیومنت تیلویند باشه

@mehdi8686h
آره ولی برای استایل لودر ها فکر کنم چیز هایی داشته باشه

https://tailwindcss.com/docs/animation

@error.404
استایل ها رو که بلدم دوست عزیز

اوکی
موفق و پیروز باشید

@error.404
همچنین

به صورت ساده میتونی توی js از ایونت load استفاده کنی برای زمانی که صفحه به صورت کامل لود میشه , البته دقت کن این load شدن به صورت عمده برای هر نوع DOM و ریکوئستی هست که در زمان اجرای اولیه ارسال میشه و مثلا اگه بعد از اجرای اولیه ریکوئست ها شما یک ریکوئست برای دریافت مقالات ( به عنوان مثال ) ارسال کنید خب این میتونه توی اسکریپت لودینگ شما مشکلاتی ایجاد کنه البته با نوشتن یک سورس به عنوان ماژول که توی اون هم لودینگ اجرا بشه و هم ریکوئست هارو از اون طریق ارسال کنی میتونی این مشکل رو حل کنی :) به ساده ترین شکل اینه که یک متغیر ساده بنویسی و در زمانی که ریکوئست ها با readyState 4 برگشت داده میشه و ریسپانس رو دریافت کردی مقدار متغیر رو به false تغییر بدی و در زمانی که ریکوئست ها ارسال میشه هم مقدار رو true نگهداری اینجوری میتونی بفهمی صفحه کامل لود شده یا نه

البته من خیلی چیز میز الان اضافه کردم بهش و درکل اگر ریکوئستی ارسال نمیکنی از طریق xhr و ... میتونی خیلی راحت با همون ایونت load بارگذاری صفحه رو متوجه بشی

سلام
تا جایی که فهمیدم سوال شما اینه که بعد از لود شدن کامل چطور استایل ها عوض شه یا اون لودر حذف شه
خب توی جی کوئری اگر استفاده میکنی ما document.ready داریم load داریم توی جاوا اسکریپت هم متد هایی داریم خیلی راحت با یه سرچ ساده میتونی پیدا کنی حالا من چند مثال این زیر قرار میدم ببین چی ب کارت میاد

$(window).on("load", function() {
    $('#preloader').delay(2500).fadeOut(500);
});

  window.addEventListener('load', function() {
    var spinner = document.getElementById('loading-spinner');
    spinner.style.display = 'none';
  });

document.onreadystatechange = function() {
    if (document.readyState !== "complete") {
        document.querySelector("body").style.visibility = "hidden";
        document.querySelector("#loader").style.visibility = "visible";
    } else {
        document.querySelector("#loader").style.display = "none";
        document.querySelector("body").style.visibility = "visible";
    }
};

$(window).load(function(){ 
 //PAGE IS FULLY LOADED 
 //FADE OUT YOUR OVERLAYING DIV
 $('#overlay').fadeOut();
});

@rezafaghih
@salar.mohammad2013
@Raymond
ممنون دوستان بابت راهنمایی