04 апреля 2008 ~ 3865 Комментариев

Простой скроллинг внутри блока

Css

thumb

Опишу простенький способ для создания вертикальной прокрутки внутри блока. Отлично подойдет для сайта в котором место ограничено какими то рамками.

Принцип работы

Прокрутка будет происходить после наведения на кпопку для прокрутки, при нажатии на кнопку будет происходить прокрутка с удвоенной скоростью. Все это будет работать с помощью небольшого javascripta весом всего в 3 килобайта, что не может не радовать :-)

Использование

Вставляем код подключения скрипта между тегами <head></head>

<script type="text/javascript" src="easyscroll/easyscroll.js"></script>

Создаем блок с текстом

<div id="myContent">
	<!--  ТУТ БУДЕТ ВАШ ЧУДЕСНЫЙ ТЕКСТ -->
</div>

И вообще то это все, возле вашего контейнера с текстом(myContent) появляться кнопки для управления.

Настраиваем скрипт


/* Айди вашего блока с текстом */
var id = "myContent"; 

/* Названия ваших кнопок */
var nav = ["Scroll Up", "Scroll Down", "Reset"];

/* Айди ваших кнопок */
var navId = ["btnUp", "btnDown", "btnReset"];

/* Скорость движения текста в блоке */
var speed = 5; 

/* Высота вашего блока */
var height = 200;

 

Вообщем то все, всем удачного дня :-)

Смотрим пример

Скачиваем пример

 

Нагло сперто с cssglobe.com

3865 Комментариев для “Простой скроллинг внутри блока”

  1. mastering service 21 мая 2012 at 15:29 Permalink

    This blog is really interesting and informative. I have chosen a lot of helpful things out of it. I’d love to go back over and over again. Thanks!

  2. entertainment 21 мая 2012 at 15:48 Permalink

    Hello. excellent job. I did not imagine this. This is a impressive story. Thanks!

  3. parainfluenza virus pneumonia 21 мая 2012 at 16:15 Permalink

    I like the valuable info you provide in your articles. I’ll bookmark your weblog and check again here frequently. I am quite sure I will learn a lot of new stuff right here! Best of luck for the next!

  4. Jadwal EURO 21 мая 2012 at 16:36 Permalink

    I went over this web site and I think you have a lot of excellent info, saved to my bookmarks (:.

  5. This is an extremely gripping article. I’ll marker me

  6. headlights 21 мая 2012 at 16:59 Permalink

    Getting aTrading inside of aPurchasing aObtaining a gaggle of automobile headlightsvehicle vehicle headlightsfront lighting which seemsappears fantastic too astogether together with suits fantastic

  7. George 21 мая 2012 at 17:12 Permalink

    I together with my buddies were checking out the great guidelines located on the website then at once I had a horrible feeling I had not thanked the blog owner for those secrets. My guys appeared to be for that reason joyful to learn all of them and have now in reality been having fun with them. Thanks for indeed being well considerate and then for getting varieties of brilliant issues most people are really desperate to learn about. My personal sincere apologies for not saying thanks to earlier.

  8. mortgage brokers calgary 21 мая 2012 at 17:26 Permalink

    Simply wish to say your article is as surprising. The clearness on your publish is just spectacular and i can think you are an expert on this subject. Fine together with your permission let me to seize your RSS feed to keep up to date with imminent post. Thank you one million and please continue the enjoyable work.

  9. Prix référencement 21 мая 2012 at 17:45 Permalink

    There are people of hell, is not easy, of course.

  10. Stanford Angove 21 мая 2012 at 17:47 Permalink

    I randomly browse blogs on the internet, and I find your article to be very informational. I have already bookmark it on my browser, so that I can view your weblog post once more later. Also, I am wondering whether or not your blog is open for link alternate, as I really wish to change links with you. I do not normally do that, however I hope that we can have a mutual hyperlink exchange. Let me know and have a terrific day!

  11. guitar lessons online 21 мая 2012 at 18:05 Permalink

    Nice read, I just passed this onto a colleague who was doing some research on that. And he truly bought me lunch as I located it for him smile So let me rephrase that: Thank you for lunch!

  12. bingo website reviews 21 мая 2012 at 19:23 Permalink

    Hello my loved one! I wish to say that this post is amazing, great written and come with approximately all significant infos. I would like to see extra posts like this .

  13. knullkontakter 21 мая 2012 at 19:57 Permalink

    I conceive other website proprietors should take this website as an example , very clean and great user pleasant design .

  14. bayan escort izmir 21 мая 2012 at 20:10 Permalink

    izmir bayan escortlar kulubü.

  15. ralph lauren shoes uk 21 мая 2012 at 20:48 Permalink

    Youre so awesome, man! I cant believe I missed this blog for so long. Its just great stuff all round. Your design, man…too amazing! I cant wait to read what youve got next. I love everything that youre saying and want more, more, MORE! Keep this up, man! Its just too good.

  16. Cheap Hotel 21 мая 2012 at 20:49 Permalink

    Excellent website. Lots of useful info here. I’m sending it to some friends ans also sharing in delicious. And of course, thanks for your effort!

  17. phen375 reviews 21 мая 2012 at 21:34 Permalink

    Yay google is my king aided me to find this great website ! .

  18. nike shox monster Oransje pris 21 мая 2012 at 21:55 Permalink

    Simply a smiling visitant here to share the love (:, btw outstanding style .

  19. 770 casino 21 мая 2012 at 21:59 Permalink

    An impressive share, I just given this onto a colleague who was doing a little analysis on this. And he in fact bought me breakfast because I found it for him.. smile. So let me reword that: Thnx for the treat! But yeah Thnkx for spending the time to discuss this, I feel strongly about it and love reading more on this topic. If possible, as you become expertise, would you mind updating your blog with more details? It is highly helpful for me. Big thumb up for this blog post!

  20. maternity savers 21 мая 2012 at 22:03 Permalink

    I like the helpful info you provide in your articles. I will bookmark your blog and check again here regularly. I’m quite certain I’ll learn many new stuff right here! Good luck for the next!

  21. antibiotics and alcohol 21 мая 2012 at 22:05 Permalink

    Hello, i think that i saw you visited my website so i came to “return the favor”.I’m trying to find things to enhance my site!I suppose its ok to use a few of your ideas!!

  22. Ezra Cunniff 21 мая 2012 at 22:13 Permalink

    VERY GOOD!

  23. Play Slots 21 мая 2012 at 22:21 Permalink

    After study a few of the blog posts on your website now, and I truly like your way of blogging. I bookmarked it to my bookmark website list and will be checking back soon. Pls check out my web site as well and let me know what you think.

  24. things to do in Bali 21 мая 2012 at 23:04 Permalink

    Hiya! Amazing weblog! I happen to be a everyday visitor to your site (somewhat far more like addict ) of this internet site. Just wanted to say I appreciate your blogs and am seeking forward for much more!

  25. Opel Tigra for sale 21 мая 2012 at 23:13 Permalink

    Hi, I just found your website via Bing. Your post is truly pertinent to my life currently, and I’m really delighted I found your website.

  26. Sheldon Kopperud 21 мая 2012 at 23:20 Permalink

    I just couldn’t depart your website prior to suggesting that I actually enjoyed the standard info a person provide for your visitors? Is going to be back often to check up on new posts

  27. Jess Vieweg 21 мая 2012 at 23:52 Permalink

    With havin so much content do you ever run into any problems of plagorism or copyright infringement? My website has a lot of completely unique content I’ve either created myself or outsourced but it appears a lot of it is popping it up all over the web without my authorization. Do you know any techniques to help prevent content from being stolen? I’d really appreciate it.

  28. duur ww uitkering 22 мая 2012 at 0:18 Permalink

    Superb read, I just passed this onto a colleague who was doing a little research on that. And he actually bought me lunch because I located it for him smile So let me rephrase that: Thanks for lunch!

  29. tava tea 22 мая 2012 at 1:03 Permalink

    fantastic post. Ne’er knew this, thankyou for letting me know.

  30. reviews on phen375 22 мая 2012 at 1:17 Permalink

    As soon as I found this site I went on reddit to share some of the love with them.

  31. Spanduk 22 мая 2012 at 1:17 Permalink

    Simply wish to say your article is as astonishing. The clarity in your post is just cool and i could assume you’re an expert on this subject. Fine with your permission let me to grab your feed to keep updated with forthcoming post. Thanks a million and please keep up the rewarding work.


Оставить комментарий