Перейти к содержимому

Фотография
- - - - -

Помогите с фреймворком Bootsrap 3


  • Вы не можете создать новую тему
  • Закрытая тема Тема закрыта
В этой теме нет ответов

#1 ProXa

ProXa

    Прохожий

    Топикстартер
  • Новичок
  • 0
    1 сообщ.

Отправлено 16 Июнь 2015 в 19:19

Bootsrap установил (.css .js и jqwery)
Но вот плагины от него никак не могу подключить! с js я не дружу так как изучать его еще не начал.
сайт начал переделывать специально под bootsrap, пока создал только каркас. cs-exez.ru

Я пересмотрел все сайты с инструкциями, видео и статьями - как же подключить плагины bootsrap
вот список плагинов getbootstrap.com/javascript/
Вот код на главной странице сайта:

<!DOCTYPE html>
<html lang="ru">
<head>
<title><?php echo $site_title_buy; ?></title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width">
<link rel="shortcut icon" href="http://cs-exez.ru/img/favicon/favicon.ico">
<meta name="description" content="Сеть игровых серверов Counter-Strike 1.6 | Информация по серверам и проекту!" />
<meta name="keywords" content="Сеть, игровые, сервера. counter, strike, 1.6, 16, cs, информация, проект" />
<meta name="author" content="ProXa :^)" />
<meta name="publisher-email" content="aaronvk@yandex.ru" />
<meta name="robots" content="index, follow" />
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet">
</head>

<body scroll="yes" style="background-color:silver">
<div class="navbar clearfix navbar-default">
         <a href="/" class="btn btn-primary btn-lg">&nbsp;Главная</a>
<a href="http://stats.cs-exez.ru/" class="btn btn-primary btn-lg">&nbsp;Статистика</a>
<a href="http://csbans.cs-exez.ru/" class="btn btn-primary btn-lg">&nbsp;Бан лист</a>
         <a href="http://motd.cs-exez.ru/" class="btn btn-primary btn-lg">&nbsp;Мотд окно</a>
         </div>
<div class="container-fluid">
         <div class="col-lg-11 col-md-11 col-sm-11 col-xs-11 alert alert-info" role="alert">
         <p><span rel="tooltip_bottom" title="подсказка"><a href="/"><b>ссылка</b></a></span><br> Сайт на реконструкции! В скором времени добавлю меню и коментарии в которых вы сможете посоветовать как будет лучше или красивее.</p>
         </div>
</div>
<div class="container-fluid">
<div class="well">
         <div class="row">
                 <div class="col-lg-3 col-md-3 col-sm-3 hidden-xs alert alert-warning" role="alert">
         <div class="col-lg-12 col-md-12 col-sm-12 hidden-xs alert alert-success" role="alert">green</div>
</div>
                 <div class="col-lg-6 col-md-6 col-sm-6 alert alert-success" role="alert">
                         <div class="hidden-lg hidden-md hidden-sm visible-xs">{include file="mbutton.tpl"}
                         </div>
                         <br class="hidden-lg hidden-md hidden-sm visible-xs">
                 <div class="col-lg-12 col-md-12 col-sm-12 alert alert-danger" role="alert">red</div>
</div>
                 <div class="col-lg-3 col-md-3 col-sm-3 hidden-xs alert alert-danger" role="alert">
                 <div class="col-lg-12 col-md-12 col-sm-12 hidden-xs alert alert-info" role="alert">blue</div>
</div>
         </div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script src="https://dl.cs-exez.ru/styles/js/npm.js"></script>
<script>
$(function () {
$('[data-toggle="tooltip"]').tooltip()
})
</script>
</body>
</html>

у меня на сайте разметка ровная! можете просмотреть ее через инспектор кода.


в самом низу подключил библиотеку jqwery, bootsrap.js и npm.js файл со всеми плагинами
 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script src="https://dl.cs-exez.ru/styles/js/npm.js"></script>
<script>
$(function () {
$('[data-toggle="tooltip"]').tooltip()
})
</script>
вот и сам npm.js файл
require('https://dl.cs-exez.ru/styles/js/transition.js')
require('https://dl.cs-exez.ru/styles/js/alert.js')
require('https://dl.cs-exez.ru/styles/js/button.js')
require('https://dl.cs-exez.ru/styles/js/carousel.js')
require('https://dl.cs-exez.ru/styles/js/collapse.js')
require('https://dl.cs-exez.ru/styles/js/dropdown.js')
require('https://dl.cs-exez.ru/styles/js/modal.js')
require('https://dl.cs-exez.ru/styles/js/tooltip.js')
require('https://dl.cs-exez.ru/styles/js/popover.js')
require('https://dl.cs-exez.ru/styles/js/scrollspy.js')
require('https://dl.cs-exez.ru/styles/js/tab.js')
require('https://dl.cs-exez.ru/styles/js/affix.js')

все ссылки проверил не малое количество раз!
в синем блоке есть ссылка на нее установил tooltip, вот код:

<span rel="tooltip_bottom" title="подсказка"><a href="/"><b>ссылка</b></a></span>

на title можете внимания не обращать!
и чуть не забыл: на сайт установил движок DLE так как времени создавать новый нету. (движок мне что бы удобнее было сайтом управлять)

если кто может дайте подробную инструкцию как установить эти плагины и включить их! (напомню что я в js полный ноль)


Сообщение отредактировал BaNru: 16 Июнь 2015 в 20:54

  • 0

Спонсор



Похожие темы Свернуть

  Название темы Форум Автор Статистика Последнее сообщение
Статистика

Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 скрытых пользователей