Hello there i want to insert image slider in front page of my website but i’m not getting any of thr perfect slider as i want and i want to insert slider as the Fiverr.com has in the front page so please help me to solve it. I’have tried a lot but not getting it so please help m.
Show us the code that you’ve tried but doesn’t work the way you want it to.
This is the slider which i have created with the help of software named as mobirise and here’s the code for it it is perfect but i am getting it in the full page instead of half page as like fiverr.com does
<!DOCTYPE html>
<html>
<head>
<!-- Site made with Mobirise Website Builder v3.10.1, https://mobirise.com -->
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="generator" content="Mobirise v3.10.1, mobirise.com">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="assets/images/logo.png" type="image/x-icon">
<meta name="description" content="">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic&subset=latin">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Montserrat:400,700">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Raleway:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i">
<link rel="stylesheet" href="assets/bootstrap-material-design-font/css/material.css">
<link rel="stylesheet" href="assets/web/assets/mobirise-icons/mobirise-icons.css">
<link rel="stylesheet" href="assets/tether/tether.min.css">
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/animate.css/animate.min.css">
<link rel="stylesheet" href="assets/dropdown/css/style.css">
<link rel="stylesheet" href="assets/theme/css/style.css">
<link rel="stylesheet" href="assets/mobirise/css/mbr-additional.css" type="text/css">
</head>
<body>
<section id="menu-0">
<nav class="navbar navbar-dropdown bg-color transparent navbar-fixed-top">
<div class="container">
<div class="mbr-table">
<div class="mbr-table-cell">
<button class="navbar-toggler pull-xs-right hidden-md-up" type="button" data-toggle="collapse" data-target="#exCollapsingNavbar">
<div class="hamburger-icon"></div>
</button>
<ul class="nav-dropdown collapse pull-xs-right nav navbar-nav navbar-toggleable-sm" id="exCollapsingNavbar"><li class="nav-item"><a class="nav-link link" href="http://localhost/job/about.php"><p> </p></a></li><li class="nav-item dropdown"><a class="nav-link link" href="http://localhost/job/contact.php" aria-expanded="false"></a></li></ul>
<button hidden="" class="navbar-toggler navbar-close" type="button" data-toggle="collapse" data-target="#exCollapsingNavbar">
<div class="close-icon"></div>
</button>
</div>
</div>
</div>
</nav>
</section>
<section class="engine"><a rel="external" href="https://mobirise.com">free mobile web site builder</a></section><section class="mbr-slider mbr-section mbr-section__container carousel slide mbr-section-nopadding mbr-after-navbar" data-ride="carousel" data-keyboard="false" data-wrap="true" data-pause="false" data-interval="2000" id="slider-0">
<div>
<div>
<div>
<ol class="carousel-indicators">
<li data-app-prevent-settings="" data-target="#slider-0" data-slide-to="0" class="active"></li><li data-app-prevent-settings="" data-target="#slider-0" data-slide-to="1"></li><li data-app-prevent-settings="" data-target="#slider-0" class="" data-slide-to="2"></li>
</ol>
<div class="carousel-inner" role="listbox">
<div class="mbr-section mbr-section-hero carousel-item dark center mbr-section-full active" data-bg-video-slide="false" style="background-image: url(assets/images/11-2000x1728-14.jpg);">
<div class="mbr-table-cell">
<div class="mbr-overlay"></div>
<div class="container-slide container">
<div class="row">
<div class="col-md-8 col-md-offset-2 text-xs-center">
<h2 class="mbr-section-title display-1"><br>Searching FoR Job?</h2>
<p class="mbr-section-lead lead"></p>
</div>
</div>
</div>
</div>
</div><div class="mbr-section mbr-section-hero carousel-item dark center mbr-section-full" data-bg-video-slide="false" style="background-image: url(assets/images/12-2000x1382-3.jpg);">
<div class="mbr-table-cell">
<div class="mbr-overlay"></div>
<div class="container-slide container">
<div class="row">
<div class="col-md-8 col-md-offset-1">
<h2 class="mbr-section-title display-1">Wanna Job?</h2>
<p class="mbr-section-lead lead"></p>
</div>
</div>
</div>
</div>
</div><div class="mbr-section mbr-section-hero carousel-item dark center mbr-section-full" data-bg-video-slide="false" style="background-image: url(assets/images/sparklers.jpg);">
<div class="mbr-table-cell">
<div class="mbr-overlay"></div>
<div class="container-slide container">
<div class="row">
<div class="col-md-8 col-md-offset-3 text-xs-right">
<h2 class="mbr-section-title display-1">Just Wake up</h2>
<p class="mbr-section-lead lead"></p>
<div class="mbr-section-btn"><a class="btn btn-lg btn-info" href="http://localhost/job/login.php"><span class="mbri-alert mbr-iconfont mbr-iconfont-btn"></span>Login</a> <a class="btn btn-lg btn-white btn-white-outline" href="http://localhost/job/register.php"><span class="mbri-like mbr-iconfont mbr-iconfont-btn"></span>Sign in!</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
<a data-app-prevent-settings="" class="left carousel-control" role="button" data-slide="prev" href="#slider-0">
<span class="icon-prev" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a data-app-prevent-settings="" class="right carousel-control" role="button" data-slide="next" href="#slider-0">
<span class="icon-next" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
</div>
</section>
<footer class="mbr-small-footer mbr-section mbr-section-nopadding mbr-parallax-background" id="footer1-2" style="background-image: url(assets/images/index-2000x1120-57.jpg); padding-top: 1.75rem; padding-bottom: 1.75rem;">
<div class="mbr-overlay" style="opacity: 0.8; background-color: rgb(68, 68, 68);"></div>
<div class="container">
<p class="text-xs-center">Copyright (c) 2016 Mobirise.</p>
</div>
</footer>
<script src="assets/web/assets/jquery/jquery.min.js"></script>
<script src="assets/tether/tether.min.js"></script>
<script src="assets/bootstrap/js/bootstrap.min.js"></script>
<script src="assets/smooth-scroll/SmoothScroll.js"></script>
<script src="assets/viewportChecker/jquery.viewportchecker.js"></script>
<script src="assets/dropdown/js/script.min.js"></script>
<script src="assets/touchSwipe/jquery.touchSwipe.min.js"></script>
<script src="assets/jarallax/jarallax.js"></script>
<script src="assets/bootstrap-carousel-swipe/bootstrap-carousel-swipe.js"></script>
<script src="assets/theme/js/script.js"></script>
<input name="animation" type="hidden">
</body>
</html>
@amitkanjiyani3398: it has now been explained to you several times, in your topics and by PM, that you need to format your code for it to show up correctly. If you want help with your code, then the first thing to do is to ensure you post it in such a way that it will display correctly for other members to view.
See this thread, if you need a reminder.
Sorry for this…
Might also be better posting in the HTML / CSS section, as I don’t see any PHP content in there.
1 Like
Moved. (Not sure if it’s better here or in JS, but as you say, it doesn’t seem to have anything to do with PHP.)
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.