Mvc kayan yazı .cshtml

Merhaba,

Bu yazımda sizlerle birlikte mvc projenizde ihtiyacınız olması durumunda kayan yazı nasıl yapabilirsiniz paylaşacağım.

Öncelikle kayan yazı günlük hayatta da karşımıza genelde led panellerde mağazaların reklam ya da indirim panolarında karşımıza çıkmaktadır.

Bunu web ortamda  html tagıyla ifade edecek olursak  ;  <marquee >oguzaltuntas.com</marquee> basitçe şeklinde ifade edebiliriz.

Yukarıdaki html kod genişletilebilir sağdan sola ,soldan sağa ,aşağı yukarı vb.

Gelelim mvc üzerinde kayan yazıyı herhangi bir sayfanızda nasıl ekleyeceğinize.

Index.Cshtml dosyasınızın olduğunu varsayalım siz kayan yazıyı ayrı bir view yaparak(Partial) bunu index viewinde çağıralım.

@{Html.RenderAction(“kayanYazi”, “Anasayfa”);}

 

kayan yazı viewinizi de;

@{
ViewBag.Title = “kayanYazi”;
//Layout = “~/Views/Shared/_Layout.cshtml”;

}
@RenderBody()
@model IEnumerable<deneme>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0, maximum-scale=1.0″ />
<link href=”~/assets/marquee.css” rel=”stylesheet” />
@*<p style=”text-align:center”><a href=”http://designify.me/popular/simple-marquee-horizontal-text-scrolling-with-jquery/”>Back to the article</a></p>*@
<div class=”content”>
<div class=”container”>
<div class=”marquee-sibling”>
PTF:
</div>
<div class=”marquee”>
<ul class=”marquee-content-items”>

@foreach (var u in Model)
{

<li>@u.saat : @u.deger</li>

}

</ul>
</div>
</div>
<script src=”http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js”></script>

<script src=”~/assets/marquee.js”></script>
<script>
$(function () {

createMarquee({
});

});

</script>
</div>

şeklinde  oluşturabilirsiniz.

Bir sonraki yazımda görüşmek üzere.

Oğuz ALTUNTAŞ © 2019

Bunlarda ilgini çekebilir !