将 Jquery 与 php 和 html 一起使用


Use Jquery with php and html

我是使用Jquery的新手。我试图实现的是淡入页面上的任何元素。但是,我的页眉和页脚是通过使用 PHP include() 显示的,我可以将 Jquery 与这种类型的格式一起使用吗?我无法让任何东西淡入()。

  <!DOCTYPE html>
   <head>
   <title> <Header> </title>
enter code here
   <script src="jquery-1.10.2.min.js"></script>
   <script>
      $(document).ready(function(){
        $('#nav').fadeIn(3000);
    });
   </script>
  </head>
 <body>
 <div id="wrapper">
    <div id="header">
        <h1>Films.com</h1>
    </div>
    <div id="content">
        <div id="nav">
            <ul>
                <li><a href="index.php">Home</a></li>
                <li><a href="film.php">Film</a></li>
                <li><a href="add_film.php">Add a Film</a></li>

            </ul>
        </div>

你想要淡入的元素需要隐藏,例如

 <div id="nav" style="display:none;">
            <ul>
                <li><a href="index.php">Home</a></li>
                <li><a href="film.php">Film</a></li>
                <li><a href="add_film.php">Add a Film</a></li>

            </ul>
        </div>

但是,我的页眉和页脚是通过使用 PHP include() 显示的,我可以将 Jquery 与这种类型的格式一起使用吗?

是的。 这种设置是在服务器端发生的,甚至在jQuery看到它之前。 您的服务器端 PHP 代码正在做的是向浏览器发出一个 HTML 页面。 在这一点上,客户端是JavaScript(包括jQuery)运行时。 它看到的只是文档的客户端结果,而不是它在服务器端的构建方式。

我无法让任何东西淡入()

您尝试使用该代码淡入的内容已显示。 它首先需要隐藏起来,然后才能淡入视野。 您可以将其样式设置为隐藏在页面的CSS中:

#nav { display: none; }

这将在页面首次加载时呈现默认隐藏的#nav元素。 然后你的JavaScript代码会使用jQuery淡入淡出。

[已解决] 试试这个:

http://jsfiddle.net/F6mUn/1/

为了淡入,您必须隐藏相应的内容

这是代码:

.HTML:

 <div id="nav" style="display:none;">
            <ul>
                <li><a href="index.php">Home</a></li>
                <li><a href="film.php">Film</a></li>
                <li><a href="add_film.php">Add a Film</a></li>

            </ul>
        </div>

JQuery:

  $(document).ready(function(){
    $('#nav').fadeIn(5000);
});