包括php中的bootstrap和js
Including bootstrap and js in php
我需要一双全新的眼睛来看待这个!
我直接从我的一把旧小提琴上取了代码https://jsfiddle.net/RachGal/fs9u6mwe/1/在大学厨房里展示照片。然而,它只显示了一个。当我在php中包含bootstrap和函数时,它似乎没有读取它!为什么会这样?
我的php看起来像这个
<?php
echo "<html><head><meta charset='utf-8'>";
echo "<script type='text/javascript' src='scripts/bootstrap.js'></script>";
echo"<link rel='stylesheet' type='text/css' href='css/style.css'>";
include "scripts/show.php";
echo" <title>Gallery Display</title></head><body>";
echo "<header>";
echo "<h1>The Ultimate Gallery Compiler</h1>";
echo "<div id='menu'><a class='head' href='index.html'>Upload Photo</a> <a class='head' href='gallery.html'>Browse Gallery</a></div>";
echo "</header>";
echo "<div id='content'>";
echo "<h2>Browse Gallery</h2>";
$subfolder = $_POST["category"];
if ($subfolder == "0"){
echo("Please <a href='gallery.html'>go back</a> and select a category");
echo "</div><br><br>";
echo "<footer>";
echo "<p class='foot'>© Copyright 2015-2016 MMA2 Rachel Gallen, Ysabel Pheifer and Rebecca Merrigan.</p>";
echo "</footer>";
exit();
}
$countcontents = file_get_contents("categories.txt"); //read file to get count
$countarray = explode('*', $countcontents); //get count of each category into an array
$categories = array("fashion", "music", "sports", "technology", "animals", "health", "other");
//output title according to if the gallery has images in it or not
for($i=0; $i< count($countarray); $i++)
{
if ($subfolder == $categories[$i]){
if (intval($countarray[$i]) == 0) {
echo "<h3>No images have been uploaded for the " .$subfolder. " category yet</h3>";
}
else
{
echo "<h3>Here are the images for the " .$subfolder. " category</h3>";
echo "<p>There are ".$countarray[$i]." photos in this category</p><br>";
}
}
}
$folder = "images/".$subfolder."/";
// Open the appropriate subfolder, and display its contents.
// http://php.net/manual/en/function.opendir.php
// also referenced https://www.youtube.com/watch?v=nGLi4ykt__0
if ($dir = opendir($folder)) {
$images = array();
while (false !== ($file = readdir($dir))) {
if ($file != "." && $file != "..") {
$images[] = $file;
}
}
closedir($dir);
}
echo '<div id="slider">';
echo "<ul id='slides'>";
foreach($images as $image) {
echo '<li class="slide"><img src="';
echo $folder.$image;
echo '" alt=""/></img></li>';
}
echo "</ul>";
echo '</div>';
echo "<p> </p><a href='gallery.html'>Reselect</a>";
echo "</div>";
echo "<footer>
<p class='foot'>© Copyright 2015-2016 MMA2 Rachel Gallen, Ysabel Pheifer and Rebecca Merrigan.</p>
</footer>";
echo "</body></html>";
?>
任何帮助都将不胜感激!
顺便说一下,javascript是
//Reference https://jsfiddle.net/RachGal/fs9u6mwe/1/
$(document).ready(function() {
//INDEX IMAGES SLIDER
$(function slider() {
//configuration
var width = 360;
var speed = 1000;
var pause = 3000;
var current = 1;
//cache DOM
var $slider = $('#slider');
var $slides = $slider.find('#slides');
var $slide = $slides.find('.slide');
setInterval(function() {
//move image the defined width and speed to the left
$slides.animate({
'margin-left': '-=' + width
}, speed, function() {
//count number of slides and loop back to first from last
current++;
if (current === $slide.length) {
current = 1;
$slides.css('margin-left', 0);
}
});
}, pause);
});
}
);
您的页面中没有包含jQuery,您在脚本中使用了jQuery,但根本没有加载它。
找到这些东西的一个好方法是使用开发者栏,在使用chrome时按F12,然后在网络上你可以看到加载了哪些文件,如果有任何javascript错误,你可以在控制台中看到。
相关文章:
- Bootstrap CSS和JS我必须将它们包含在单独的文件中,或者可以编译它们
- jquery.proxy in the bootstrap-typeahead.js context
- 理解bootstrap.js变量声明
- parent和iframe中的Bootstrap.js文件
- 如何扩展bootstrap-typeahead.js这样的库
- Rails - Bootstrap popover js
- 使用节点js的Bootstrap和Jquery
- Node.js & Express 不能用简单的 Bootstrap 表单发布/错误
- Charts.js & Bootstrap Accordion
- Bootstrap, CSS, JS - Bootstrap 文件菜单栏在点击后悬停
- Angular js bootstrap模式在bootstrap的低级版本中是不可滚动的
- react JS bootstrap JS not working
- Knockout.js + Bootstrap -奇怪的事情发生了
- JS Bootstrap模式的执行顺序
- 如何使用Angular Js + bootstrap设置弹出窗口
- 格式化Angular JS/Bootstrap选项卡
- HTML/JS - Bootstrap Datepicker
- fbAlbum2.js, bootstrap-tooltip and Magnific-Popup
- jQuery, react.js, bootstrap,验证密码
- console.log和html操作的行为不期望使用node.js, bootstrap和jquery