Почему некоторые из моих CSS форматирования теряются при использовании Ajax для вызова URL, который также передает переменные - PullRequest
1 голос
/ 27 апреля 2020

Ссылка ниже прекрасно работает, когда я копирую и вставляю ее прямо в браузер.

https://my_web_site.com / приводит_2020_card. php? State_Code_table = ID & категория = газ & долгота = -117.400 & широта = 46.500

Но когда я использую следующую функцию для вызова той же страницы, я теряю цвет фона в lead_2020_card. php, и начальный контейнер смещается вниз примерно на дюйм. Но все остальное работает и отображается правильно в оставшемся скрипте. К вашему сведению, приведенный ниже скрипт находится в файле php_loader. php «Загрузчик отображается до тех пор, пока« lead_2020_card. php »не завершит поиск в большой базе данных

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<script  src="https://code.jquery.com/jquery-3.5.0.min.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js">.</script>



<style>

body {
  margin: 0;
  padding: 0;
  font-family: 'Montserrat';
  background: black;
  color: #fff;
}
.center {
  display: flex;
  text-align: center;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
}

.ring {
  position: absolute;
  width: 200px;
  height: 200px;
  border-radius: 50%;
  animation: ring 2s linear infinite;
}
@keyframes ring {
  0% {
    transform: rotate(0deg);
    box-shadow: 1px 5px 2px #e65c00;
  }
  50% {
    transform: rotate(180deg);
    box-shadow: 1px 5px 2px #18b201;
  }
  100% {
    transform: rotate(0360deg);
    box-shadow: 1px 5px 2px #0456c8;
  }
}
.ring::before {
  position: absolute;
  left: 0;
  content: "";
  top: 0;
  height: 100%;
  width: 100%;
  border-radius: 50%;
  box-shadow: 0 0 5px rgba(255, 255, 255, 0.3);
}
span {
  color: #737373;
  font-size: 20px;
  text-transform: uppercase;
  letter-spacing: 1px;
  line-height: 200px;
  animation: text 3s ease-in-out infinite;
}
@keyframes text {
  50% {
    color: black;
  }
}
</style>




    <script>

    function loadingAjax(div_id)
    {
    $("#"+div_id).html('<div class="center"><div class="ring"></div><br><br><font color="white" face="arial" size="4"><b>Searching<br><?php echo $total_table_rows ?> records<div onload="myTimer();" style="color:white" id="demo"></div> <br>Please Wait ...</b></font></div>');
    $.ajax({
    type: "POST",
    url: "leads_2020_card.php?",
    data: "State_Code_table="+State_Code_table + "&category="+category+"&longitude="+zip_geo_longitude+"&latitude="+zip_geo_latitude,
    success: function(msg){
    $("#"+div_id).html(msg);
    }
    });
    }

    </script>
...