PHP движущееся изображение gif между двумя местами с течением времени

Question

У меня есть изображение в формате gif, и на моей странице я хочу переместить эту анимацию между двумя местами. например, он будет отображаться слева от страницы в течение 3 секунд, затем переместится в правую часть страницы и отобразится в течение 3 секунд, а затем вернется к левой части страницы, продолжайте повторять таким образом.

Я новичок в PhP и вещах на веб-сайтах, поэтому я хотел бы, чтобы кто-нибудь мог мне подсказать. Если возможно, было бы неплохо использовать простой пример кода.

Заранее спасибо! :)

php layout gif

0

user3722320 9 Июн 2014 в 16:34

1

Вам нужно сделать это на JavaScript, а не на PHP.

–

ceejayoz

9 Июн 2014 в 16:36

Answer 1

Вы можете анимировать движения изображения на экране с помощью Javascript и css. Но не в PHP.

Итак, вот ссылка на демонстрационное руководство. Код и Демо Вот код.

function reset1() {
  clearTimeout(my_time);
  document.getElementById('i1').style.left = "500px";
  document.getElementById('i1').style.top = "100px";
  document.getElementById("msg").innerHTML = "";

}



function move_img(str) {

  var x = document.getElementById('i1').offsetTop;
  x = x + 100;
  document.getElementById('i1').style.top = x + "px";

}

function disp() {
  var step = 1; // Change this step value
  //alert("Hello");
  var y = document.getElementById('i1').offsetTop;
  var x = document.getElementById('i1').offsetLeft;
  if (y < 600) {
    y = y + step;
    document.getElementById('i1').style.top = y + "px"; // vertical movment
  } else {
    if (x < 800) {
      x = x + step;
      document.getElementById('i1').style.left = x + "px"; // horizontal movment
    }
  }
  //////////////////////

}

function timer() {
  disp();
  var y = document.getElementById('i1').offsetTop;
  var x = document.getElementById('i1').offsetLeft;
  document.getElementById("msg").innerHTML = "X: " + x + " Y : " + y
  my_time = setTimeout('timer()', 10);
}

<html>

<head>
  <title>Demo of Image moving across screen in JavaScript</title>
</head>

<body>
  <img src=http://www.plus2net.com/javascript_tutorial/images/help.jpg id='i1' style="position:absolute; left: 500; top: 100;">
  <br>
  <br>
  <br>
  <br>
  <input type=button onClick=timer() value='Start'>
  <input type=button onClick=reset1() value='Reset'>
  <div id='msg'></div>

</body>

</html>

0

Nithyanandhan M 7 Сен 2015 в 11:58

Я понимаю. Я могу поставить javascript внутри php, я видел исходники php, которые почти везде включают javascript. я прав?

–

user3722320

9 Июн 2014 в 16:56

У OP пока нет достаточного количества представителей, чтобы проголосовать за вас.

–

Ilmari Karonen

9 Июн 2014 в 17:08

Пожалуйста, не размещайте ссылки только на ответы. Это лучше подходит в качестве комментария.

–

Jay Blanchard

9 Июн 2014 в 17:36

Answer 2

Вы можете сделать это с помощью Js. Попробуйте это. сохраните этот код как html.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
.divmain{ width:1000px; height:400px; margin:0 auto;}
.divmain .left{ float:left; width:200px; height:200px;} 
.divmain .right{ float:right; width:200px; height:200px; display:none} 
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
setInterval(function(){
      $('.left').toggle();
      $('.right').toggle();                

}, 5000);

});
</script>
</head>

<body>
<div class="divmain">
    <div class="left">
        <img src="http://www.thisiscolossal.com/wp-content/uploads/2013/01/4.gif" width="200"/>
    </div>
    <div class="right">
        <img src="http://www.thisiscolossal.com/wp-content/uploads/2013/01/4.gif" width="200" />
    </div>
</div>
</body>
</html>

0

Jitendra Yadav 9 Июн 2014 в 16:58

PHP движущееся изображение gif между двумя местами с течением времени

2 ответа

Похожие вопросы

Новые вопросы

php