<section class="bg-white discus-parallax">
<div class="container">
<div class="row">
<div class="col-md-9 col-sm-9">
<section class="bilgidetay2 bglight">
<div class="owl-component owl-carousel owl-theme owl-loaded">
@{
int card108Col = 4;
int card108TotalRow = 2;
int card108CategoryOrderNumber = 16;
if (Partial.isCategoryOrderNumber(card108CategoryOrderNumber))
{
IEnumerable<Post> card108Posts = Partial.PostsOrderNumber(card108CategoryOrderNumber, 0, card108Col * card108TotalRow, Partial.Order.ID, true, lang);
<div class="owl-stage-outer">
<div class="owl-stage" style="transform: translate3d(-5300px, 0px, 0px); transition: all 0.25s ease 0s; width: 6572px;">
@foreach (Post comPost in card108Posts)
{
<div class="owl-item" style="width: 212px; margin-right: 0px;">
<div class="col-sm-3 col-md-3 wow fadeIn animated animated p-0" data-wow-duration=".5s" data-wow-delay=".1s" style="visibility: visible; animation-duration: 0.5s; animation-delay: 0.1s; animation-name: fadeIn;">
<div class="kutu">
<div class="kenarlik text-center">
<a href="@Partial.PostLink(comPost.PostID)">
<div class="kanvas2" style="background-image: url(@comPost.PostThumbnail)"></div>
<div class="baslikiki text-center" style="width:200px;">
<h3>@comPost.PostTitle.HtmlEncode()</h3>
</div>
</a>
</div>
<div class="yuvarlak">
<a href="@Partial.PostLink(comPost.PostID)">
@Partial.PostMeta(comPost.PostID, "Makale Sayı")
</a>
</div>
</div>
</div>
</div>
}
</div>
</div>
<div class="owl-thumbs"></div>
}
}
</div>
</section>
@{
int card109Col = 2;
int card109TotalRow = 1;
int card109CategoryOrderNumber = 3;
if (Partial.isCategoryOrderNumber(card109CategoryOrderNumber))
{
IEnumerable<Category>
card109Category = Partial.CategorySubOrderNumber(card109CategoryOrderNumber, lang);
int card109Count = Convert.ToInt32(Math.Ceiling(card109Category.Count() / Convert.ToDouble(card109Col)));
for (int componen = 0; componen < card109TotalRow; componen++)
{
<div class="row">
@foreach (Category comCategory in card109Category.Skip(componen * card109Col).Take(card109Col))
{
<div class="col-md-6">
<a href="@Partial.CategoryLink(comCategory.CategoryID)">
<img src="@comCategory.CategoryThumbnail">
</a>
<div class="text-content text-center">
<div class="text-baslik tip-tablo">
<div class="hucre hucre-ortala">
<a href="@Partial.CategoryLink(comCategory.CategoryID)">
<h2>@comCategory.CategoryTitle.HtmlEncode()</h2>
</a>
</div>
</div>
</div>
</div>
}
</div>
}
}
}
</div>
<div class="col-md-3 col-sm-3 mt-30 hidden-xs">
<p><img alt="" src="@Partial.Translate("SagReklamAlani", lang)" style="width: 257px; height: 666px;"></p>
</div>
</div>
</div>
</section>
$('.owl-stage').owlCarousel({
margin: 10,
loop: true,
autoplay: true,
autoplayTimeout: 2000,
autoplayHoverPause: true,
nav: false,
navText: [
'<div class="owl-prev" style="">prev</div>',
'<div class="owl-next" style="">next</div>'
],
dots: false,
responsive: {
0: {
items: 1
},
600: {
items: 2
},
1000: {
items: 4
}
}
});
STANDART JAVASCRİPT ( Aşağıdaki kod ekli ise tekrar eklemeye gerek yok)
<script>hljs.initHighlightingOnLoad();</script>
<script type="text/javascript">
$(document).ready(function () {
$('.counter').each(function () {
$(this).prop('Counter', 0).animate({
Counter: $(this).text()
}, {
duration: 4000,
easing: 'swing',
step: function (now) {
$(this).text(Math.ceil(now));
}
});
});
// Carouselin JAVASCRİPTi BURAYA EKLENECEK
});
</script>
.bilgidetay2 .kanvas2 {
min-height: 200px !important;
background-color: #fff;
border: 6px solid rgb(215, 216, 222);
border-radius: 115px;
width: 194px;
line-height: 200px;
font-size: 20px;
color: white;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
text-shadow: #2d4251 5px 5px 5px;
margin-left: auto;
margin-right: auto;
}
.kanvas2 {
width: 100%;
min-height: 200px;
max-height: 200px;
overflow: hidden;
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
.baslikBir {
position: relative;
margin: 0 0;
padding-bottom: 50px;
}
.owl-theme .owl-controls .owl-nav [class*=owl-] {
font-size: 14px;
display: inline-block;
cursor: pointer;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.owl-component .owl-prev {
top: 35%;
position: absolute;
left: 0px;
}
.owl-component .owl-next {
top: 35%;
position: absolute;
right: 0px;
}
.fa {
display: inline-block;
font: normal normal normal 14px/1 FontAwesome;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.yuvarlak {
background-color: #ff0000;
position: absolute;
top: 8.8rem;
width: 4rem;
height: 4rem;
bottom: 0;
display: flex;
z-index: 999;
padding-bottom: 10px;
border: .3rem solid #fff;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
margin-left: 10px;
}
.yuvarlak a {
font-size: 30px;
color: #fff;
margin: 19px auto;
}
.baslikiki h3 {
margin: 34px 0px;
font-weight: 600;
font-size: 18px;
}
http://www.antalyaspor.com.tr/tr
Sosyal Ağ