..


Рекламные ссылки

Удаление элементов из списка анимационных эффектов с JQuery

Статья написана Гораций Maico
Страница 1 из 2

В этой статье я объясню, как использовать JQuery библиотеки для обработки удаления элементов списка с эффектом анимации.

Пример, приведенный в этой простой учебник вдохновлен эффект, произведенный на удаление элементов в доске объявлений профиль Facebook (хорошо, не правда ли?).

Во-первых, я предлагаю вам создать тестовую базу данных состоит из одной таблицы структурированы следующим образом: 

 



 CREATE TABLE сообщений (







 msg_id INT PRIMARY KEY AUTO_INCREMENT,

 





 Текст сообщения







 );
Наш стол "сообщения", как вы видите, он состоит всего из двух полей: msg_id которое будет идентифицировать сообщения и сообщения, содержащего текст, это может добавить дополнительные поля, в зависимости от использования сценариев вы хотите сделать " пример.

Теперь создайте файл (который мы будем использовать в включение в PHP-скрипт, который будет создавать и другие), где мы собираемся установить подключение к нашей базе данных: 






 <? Php







 Конн $ = mysql_connect ("HOST", "ИМЯ" "пароль") или умереть (mysql_error ());







 mysql_select_db ("db_name", $ сопп) или умереть (mysql_error ());







 ?>
Сохраните файл как "dbconfig.php".
Теперь давайте создадим индекс (который будет сохранить как "index.php") из доступных элементов, каждый сопровождается кнопка для удаления: 





 <html>







 <head>







 <title> элементы с эффектом Cancela FadeOut </ TITLE>







 <link rel="stylesheet" href="stile.css" type="text/css"/>







 <script type="text/javascript" src="jquery.js"> </ SCRIPT>







 <script type="text/javascript" src="cancella.js"> </ SCRIPT>







 </ HEAD>







 <body>







 <h1> список удаленных элементов </ h1>







 <ol class="messaggi">







 <? Php







 / / Подключение к базе данных.

 





 включают в себя ("dbconfig.php");









 / / Выбор запроса сообщений, хранящихся в таблице сообщений.

 





 $ SQL = "SELECT * FROM порядке сообщения, msg_id DESC";

 







 / / Выполнение запроса.

 





 $ Result = mysql_query ($ SQL, $ сопп);

 





 в то время как ($ строка = mysql_fetch_array ($ результат)) {



  



 $ Message = stripslashes ($ строки ["сообщение"]);



  



 $ Msg_id = $ строки ['msg_id'];



  

  



 / / Вывод результата запроса сообщений в виде списка элементов.

 

  



 / / Добавить X к каждой функции удаления поста.

 

  



 ?>



  



 <li> <? PHP Эхо $ сообщении;?> <HREF = "#" ID = "<PHP Эхо $ msg_id;?>" класс = "delete_button"> X </> </ LI>



  



 <? Php







 }







 ?>







 </ OL>







 </ Body>







 </ Html>
Как уже было сказано, чтобы каждый пункт в этом списке имеет соответствующей ссылки (в моем примере я использовал простой X) сопоставим - метод использования JQuery - функция удаления.

В той же категории ...
E-Learning
ASP Zero (книгу) ASP Zero (книгу)
Обучение Microsoft ASP и VBScript, с нуля. Находясь всего в 29 €.
Javascript (курс) Javascript (курс)
Полное руководство для сценариев на стороне клиента. С 39 €.
PHP (курс) PHP (курс)
Полный курс для создания динамических веб-сайтов. От 49 €.
Рекламные ссылки