我想在滑塊中顯示圖像
[英]I want to show images in my slider
問題描述
我想在滑塊中顯示圖像。我從數據庫中選擇了路徑，但在滑塊中僅顯示了第一張圖像，但另外2個圖像路徑卻不是來自數據庫。我使用mysqli_fetch_array來獲取圖像的路徑。 請幫助我。
<?php
$con=mysqli_connect('localhost','root','','builder');
?>
<?php
$sql="SELECT `path` FROM `slider` ";
$res=mysqli_query($con,$sql);
$row=mysqli_fetch_array($res,MYSQLI_BOTH);
?>
<!--Slider-->
<section id="slide-show">
<div id="slider" class="sl-slider-wrapper">
<!--Slider Items-->
<div class="sl-slider">
<!--Slider Item1-->
<div class="sl-slide item1" data-orientation="horizontal" data-slice1-rotation="-25" data-slice2-rotation="-25" data-slice1-scale="2" data-slice2-scale="2">
<div class="sl-slide-inner">
<div class="container">
<img class="pull-right" src="admin/<?php echo $row[0]; ?>" alt="" />
<h2>Creative Ideas</h2>
<h3 class="gap">Tincidunt condimentum eros</h3>
<a class="btn btn-large btn-transparent" href="#">Learn More</a>
</div>
</div>
</div>
<!--/Slider Item1-->
<!--Slider Item2-->
<div class="sl-slide item2" data-orientation="vertical" data-slice1-rotation="10" data-slice2-rotation="-15" data-slice1-scale="1.5" data-slice2-scale="1.5">
<div class="sl-slide-inner">
<div class="container">
<img class="pull-right" src="admin/<?php echo $row[1]; ?>" alt="" />
<h2>Planning & Analysis</h2>
<h3 class="gap">Aenean ultricies mi vitast</h3>
<a class="btn btn-large btn-transparent" href="#">Learn More</a>
</div>
</div>
</div>
<!--Slider Item2-->
<!--Slider Item3-->
<div class="sl-slide item3" data-orientation="horizontal" data-slice1-rotation="3" data-slice2-rotation="3" data-slice1-scale="2" data-slice2-scale="1">
<div class="sl-slide-inner">
<div class="container">
<img class="pull-right" src="admin/<?php echo $row[2]; ?>" alt="" />
<h2>Unique Solutions</h2>
<h3 class="gap">Breatures who have been utterly</h3>
<a class="btn btn-large btn-transparent" href="#">Learn More</a>
</div>
</div>
</div>
<!--Slider Item3-->
</div>
<!--/Slider Items-->
<!--Slider Next Prev button-->
<nav id="nav-arrows" class="nav-arrows">
<span class="nav-arrow-prev"><i class="icon-angle-left"></i></span>
<span class="nav-arrow-next"><i class="icon-angle-right"></i></span>
</nav>
<!--/Slider Next Prev button-->
</div>
<!-- /slider-wrapper -->
</section>
<!--/Slider-->
<!--Services-->
<section id="services">
<div class="container">
<div class="center gap">
<h3>What We Offer</h3>
<p class="lead">Look at some of the recent projects we have completed for our valuble clients</p>
</div>
<div class="row-fluid">
<div class="span4">
<div class="media">
<div class="pull-left">
<i class="icon-globe icon-medium"></i>
</div>
<div class="media-body">
<h4 class="media-heading">Web Design</h4>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>
</div>
</div>
</div>
<div class="span4">
<div class="media">
<div class="pull-left">
<i class="icon-thumbs-up-alt icon-medium"></i>
</div>
<div class="media-body">
<h4 class="media-heading">Graphic Design</h4>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>
</div>
</div>
</div>
<div class="span4">
<div class="media">
<div class="pull-left">
<i class="icon-leaf icon-medium icon-rounded"></i>
</div>
<div class="media-body">
<h4 class="media-heading">Email Marketing</h4>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>
</div>
</div>
</div>
</div>
<div class="gap"></div>
<div class="row-fluid">
<div class="span4">
<div class="media">
<div class="pull-left">
<i class="icon-shopping-cart icon-medium"></i>
</div>
<div class="media-body">
<h4 class="media-heading">Ecommerce Solution</h4>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>
</div>
</div>
</div>
<div class="span4">
<div class="media">
<div class="pull-left">
<i class="icon-globe icon-medium"></i>
</div>
<div class="media-body">
<h4 class="media-heading">SEO & Solution</h4>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>
</div>
</div>
</div>
<div class="span4">
<div class="media">
<div class="pull-left">
<i class="icon-globe icon-medium"></i>
</div>
<div class="media-body">
<h4 class="media-heading">Bootstrap</h4>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!--/Services-->
<section id="recent-works">
<div class="container">
<div class="center">
<h3>Our Recent Works</h3>
<p class="lead">Look at some of the recent projects we have completed for our valuble clients</p>
</div>
<div class="gap"></div>
<ul class="gallery col-4">
<!--Item 1-->
<li>
<div class="preview">
<img alt=" " src="images/portfolio/thumb/item1.jpg">
<div class="overlay">
</div>
<div class="links">
<a data-toggle="modal" href="#modal-1"><i class="icon-eye-open"></i></a><a href="#"><i class="icon-link"></i></a>
</div>
</div>
<div class="desc">
<h5>Lorem ipsum dolor sit amet</h5>
</div>
<div id="modal-1" class="modal hide fade">
<a class="close-modal" href="javascript:;" data-dismiss="modal" aria-hidden="true"><i class="icon-remove"></i></a>
<div class="modal-body">
<img src="images/portfolio/full/item1.jpg" alt=" " width="100%" style="max-height:400px">
</div>
</div>
</li>
<!--/Item 1-->
<!--Item 2-->
<li>
<div class="preview">
<img alt=" " src="images/portfolio/thumb/item2.jpg">
<div class="overlay">
</div>
<div class="links">
<a data-toggle="modal" href="#modal-1"><i class="icon-eye-open"></i></a><a href="#"><i class="icon-link"></i></a>
</div>
</div>
<div class="desc">
<h5>Lorem ipsum dolor sit amet</h5>
</div>
<div id="modal-1" class="modal hide fade">
<a class="close-modal" href="javascript:;" data-dismiss="modal" aria-hidden="true"><i class="icon-remove"></i></a>
<div class="modal-body">
<img src="images/portfolio/full/item2.jpg" alt=" " width="100%" style="max-height:400px">
</div>
</div>
</li>
<!--/Item 2-->
<!--Item 3-->
<li>
<div class="preview">
<img alt=" " src="images/portfolio/thumb/item3.jpg">
<div class="overlay">
</div>
<div class="links">
<a data-toggle="modal" href="#modal-3"><i class="icon-eye-open"></i></a><a href="#"><i class="icon-link"></i></a>
</div>
</div>
<div class="desc">
<h5>Lorem ipsum dolor sit amet</h5>
</div>
<div id="modal-3" class="modal hide fade">
<a class="close-modal" href="javascript:;" data-dismiss="modal" aria-hidden="true"><i class="icon-remove"></i></a>
<div class="modal-body">
<img src="images/portfolio/full/item3.jpg" alt=" " width="100%" style="max-height:400px">
</div>
</div>
</li>
<!--/Item 3-->
<!--Item 4-->
<li>
<div class="preview">
<img alt=" " src="images/portfolio/thumb/item4.jpg">
<div class="overlay">
</div>
<div class="links">
<a data-toggle="modal" href="#modal-4"><i class="icon-eye-open"></i></a><a href="#"><i class="icon-link"></i></a>
</div>
</div>
<div class="desc">
<h5>Lorem ipsum dolor sit amet</h5>
</div>
<div id="modal-4" class="modal hide fade">
<a class="close-modal" href="javascript:;" data-dismiss="modal" aria-hidden="true"><i class="icon-remove"></i></a>
<div class="modal-body">
<img src="images/portfolio/full/item4.jpg" alt=" " width="100%" style="max-height:400px">
</div>
</div>
</li>
<!--/Item 4-->
</ul>
</div>
</section>
2 個解決方案
解決方案1
0 2015-03-25 06:11:58
嘗試這種方式：
$quer = $mycon->query("SELECT * FROM slider ORDER BY whatever DESC");
if ($quer) {
while($querob = $quer->fetch_object())
{
echo '<img class="pull-right" src="
'.$querob->image_name.'" />
}
}
解決方案2
0 已采納 2015-03-25 06:16:21
試試這個
<?php
$sql="SELECT `path` FROM `slider` ";
$rows = array();
while($row=mysqli_fetch_array($res,MYSQLI_BOTH)){
$rows[] = $row;
}
$final = array_map('current', $rows);
echo $final[0];
echo $final[1];
?>
我想在線顯示目錄中的圖像，但不能正確顯示圖像，我該怎么做
[英]I want to show images in the directory online but it not show the images properly how I can do this
我想在瀏覽器中顯示所有圖像名稱。 這怎么可能？
[英]I want to show all the images name in the browser . how will that be possible?
我似乎無法在 slider 中顯示我的圖像。（Processwire）但是我在轉發器中的所有字段都已正確設置
[英]I cant seem to be able to display my images in the slider.(Processwire)But all my fields in the repeater are properly set
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.