Автор Тема: Изрязване на background при промяна размера на браузъра  (Прочетена 582 пъти)

0 Потребители и 1 Гост преглежда(т) тази тема.

Did0_

  • Full Member
  • ***
  • Благодарности
  • -Казани: 3
  • -Получени: 1
  • Публикации: 101
Здравейте,
някой може ли да ми даде идея как мога да направя начална страница подобна на apple.com. Когато намалявам екрана снимката да не се оразмерява а да се изрязва до определени пиксели и като стигне тези пиксели да се появява скрол. Благодаря предварително.

howto

  • Sr. Member
  • ****
  • Благодарности
  • -Казани: 44
  • -Получени: 5
  • Публикации: 341
Re: Изрязване на background при промяна размера на браузъра
« Отговор #1 -: 05 Септември 2014, 15:04:17 »
Javascript и Css . Зависи какво точно искаш да направиш. Аз един път си играх с jquery с проценти и всичко си работеше. Ето един пример не казвам, че е правилен, но пък може да ти даде идея.
Код: Javascript
  1.  
  2. /*
  3. *******Book of Rkstyle  **********
  4.        +++++++++++++++++
  5.         Author: Raycho Kovachev
  6.         Date: *****
  7.         Site: none
  8. */
  9. // Деклариране на базови променливи //
  10. var _wBody = $("body").width();
  11. var _hBody = $("body").height();
  12. // Book vars //
  13. var book = $("#book");
  14. book.width(per(_wBody,80));
  15. book.height(per(_hBody,80));
  16. var _wBook = book.width();
  17. var _hBook = book.height();
  18. // Костюмиране на body //
  19. //$("body").css("background-image", "url(css/img/bg.jpg)");
  20. // Костюмиране на book //
  21. book.css("margin-left", per(_wBody,10));
  22. book.css("margin-top", per(_hBody,10));
  23. book.css("background-image", "url(css/img/topmenu.jpg)");
  24.  
  25. // Добавяне на линия //
  26. book.append( "<div id='line'></div>" );
  27. // Добавяне на меню //
  28. book.append( "<div id='topMenu'></div>" );
  29. //Костюмиране на line //
  30. var line = $("#line");
  31. line.width(per(_wBook,4));
  32. line.height(per(_hBook,98));
  33. line.css("background-image", "url(css/img/puls.png)");
  34. line.css("margin-left", per(_wBook,48));
  35. line.css("margin-top", per(_hBody,1));
  36. // Костюмиране на меню //
  37. var topMenu = $("#topMenu");
  38. topMenu.width(per(book.width(),50));
  39. topMenu.height(per(book.height(),10));
  40. topMenu.css("margin-left", per(_wBook,25))
  41. topMenu.css("background-image", "url(css/img/topmenu.png)");
  42.  
  43.  
  44.  
  45.  
  46.  
  47. // Добавяне на линия към книгата //
  48.  
  49.  
  50.  
  51.  
  52. // Функция за изчисляване в процент //
  53. function per(num, amount){
  54.   return num*amount/100;
  55. }
  56.  
Какво точно прави. Ами взема дължината и ширината на browser-a и по него си правя размери на всичко което искам и доста точно се получава.

Avalanche

  • Administrator
  • Hero Member
  • *****
  • Благодарности
  • -Казани: 65
  • -Получени: 275
  • Публикации: 2602
  • meow
Re: Изрязване на background при промяна размера на браузъра
« Отговор #2 -: 05 Септември 2014, 23:23:42 »
Здравей,

конкретно това, което виждам аз е, че всичко се регулира през CSS. В последно време навлязоха доста неща за Responsive дизайн, че лично аз им изпуснах началото. Мога само да те насоча от тука, поне това е което виждам аз:

"Компютрите не правят каквото искаме, а каквото им кажем." Ако разбереш какво значи това няма да имаш големи проблеми, нито с никоя ОС, нито език, или софтуер.
Аз не съм програмист между другото!