BG Development


Страници: (2) 1 [2]   ( Първото ново мнение ) Reply to this topicStart new topicStart Poll

> Проблем с viewport и позициониране на елементи, Виж в мнението
relax4o
Публикувано на: 06-04-2018, 19:52
Quote Post



Име:
Група: Потребител
Ранг: Почетен член

Мнения: 2098
Регистриран на: 04.04.07



QUOTE (Sta82 @ 06-04-2018, 19:47)
QUOTE (relax4o @ 06-04-2018, 17:00)
QUOTE (Sta82 @ 06-04-2018, 14:09)
Ааа, и да е responsive също, тоест като свия браузъра, пак да няма проблеми с изгледа на въртящите се кутийки и по четирите краища на браузъра.

Някакви други рикуести да имаш за без пари? Звучиш, сякаш си шеф и даваш заповеди какво да се направи.

И защо аджеба ще зуум аутваш на 25% браузъра.

Трети път се пробвам да публикувам ново мнение, ама нещо мисли дълго-дълго и накрая се прецаква и нищо не излиза. Исках да кажа, че ще съм искрено благодарен, ако успееш да ми помогнеш и имаш времето за тази работа, разбира се, но не мога да ти платя, за съжаление. Много ли код има още да се напише, за да се случи, както трябва да го направя по домашно? Та питам си във форум, защото знам, че по форумите се решават подобен род проблеми, особено когато са свързани с темата. Гледам да не спамя много, за да не наруша правилата на форума, защото разбрах, че раздават червени точки, а аз не се чувствам като калинка. icon_lol.gif Единствено бих могъл да те почерпя виртуално с една бира (тоя лаф скоро го чух, та да се направя на оригинален), стига да знам емотикона какъв е. icon_lol.gif

Това за парите го казах в контекста, че прозвуча като шеф/клиент, който си плаща за да му се свърши работата.

Иначе ти написах как ще стане, въпроса е да можеш да ползваш функции от CSS 3.


--------------------
Бисери :D

QUOTE (oveRLuckEd)
Ползваш някоя нова версия на PHP, която е вече ооп ориентирана и заради това ти я изкарва тази грешка.


QUOTE (nbacool2)
Щом няма input полета, значи няма откъде да се направи SQL инжекция Very Happy
PM
Top
hristonev
Публикувано на: 06-04-2018, 20:18
Quote Post



Име:
Група: Потребител
Ранг: Редовен член

Мнения: 414
Регистриран на: 19.09.17



Не прочетох всичко ама translate пропъртито мои се ползва за точното позициониране в проценти ;-)
PMEmail Poster
Top
Sta82
Публикувано на: 06-04-2018, 20:26
Quote Post



Име:
Група: Потребител
Ранг: Новопостъпил

Мнения: 14
Регистриран на: 28.02.18



QUOTE (relax4o @ 06-04-2018, 19:52)
QUOTE (Sta82 @ 06-04-2018, 19:47)
QUOTE (relax4o @ 06-04-2018, 17:00)
QUOTE (Sta82 @ 06-04-2018, 14:09)
Ааа, и да е responsive също, тоест като свия браузъра, пак да няма проблеми с изгледа на въртящите се кутийки и по четирите краища на браузъра.

Някакви други рикуести да имаш за без пари? Звучиш, сякаш си шеф и даваш заповеди какво да се направи.

И защо аджеба ще зуум аутваш на 25% браузъра.

Трети път се пробвам да публикувам ново мнение, ама нещо мисли дълго-дълго и накрая се прецаква и нищо не излиза. Исках да кажа, че ще съм искрено благодарен, ако успееш да ми помогнеш и имаш времето за тази работа, разбира се, но не мога да ти платя, за съжаление. Много ли код има още да се напише, за да се случи, както трябва да го направя по домашно? Та питам си във форум, защото знам, че по форумите се решават подобен род проблеми, особено когато са свързани с темата. Гледам да не спамя много, за да не наруша правилата на форума, защото разбрах, че раздават червени точки, а аз не се чувствам като калинка. icon_lol.gif Единствено бих могъл да те почерпя виртуално с една бира (тоя лаф скоро го чух, та да се направя на оригинален), стига да знам емотикона какъв е. icon_lol.gif

Това за парите го казах в контекста, че прозвуча като шеф/клиент, който си плаща за да му се свърши работата.

Иначе ти написах как ще стане, въпроса е да можеш да ползваш функции от CSS 3.

Далеч съм от шефска позиция. Не зная как успя да се хванеш за това, аз просто поисках да ми се помогне. Ако не ти допада нрава на написаното от мен си свободен/свободна да го подминеш. Благодаря за отговора. В кръга на шегата мога да кажа: "Пари нема, действайте", ама чалгата не ми е по вкуса. Мерси още веднъж за помощта с кода, това ми трябваше. Ако се видим някъде и се познаем по някаква случайност, обещавам да черпя бира (или каквото пиеш, ама да не е много скъпо). Ще питам дали може, въпреки, че не сме го взели, но вероятно няма да е проблем. Лека вечер. icon_smile.gif
PMEmail Poster
Top
Sta82
Публикувано на: 06-04-2018, 21:58
Quote Post



Име:
Група: Потребител
Ранг: Новопостъпил

Мнения: 14
Регистриран на: 28.02.18



"И другото, което ме интересува е защо при движението на тези кутийки, вдясно и долу на екрана излизат почти целите извън видимата част на браузъра? Как може да се фиксне това? Много моля за адекватни отговори единствено с html и css, javascript за момента не ми е позволен, защото не съм започнал да го изучавам."
"Да, ама като zoom out-на браузъра на 25 % и тогава се вижда, че кутийките не се движат по ръба на видимата част на браузъра. Тоест получава се обратен ефект и кутийките идват навътре. Идеята е и при зумване да се получава, както се получава вляво и горе при каквото и да било зумване."
"Ааа, и да е responsive също, тоест като свия браузъра, пак да няма проблеми с изгледа на въртящите се кутийки и по четирите краища на браузъра."

Много моля по човешки, в контекста на написаното, който има отговор на този въпрос, без да се ползват CSS функции като calc, да ми помогне да разреша този проблем. Целият код, който съм ползвал, съм го публикувал като първи коментар, но поради раздуване на темата е на първа страница. Просто ми трябва да знам какво точно да направя и къде точно да го вмъкна в този код. Мерси в аванс! icon_smile.gif
PMEmail Poster
Top
Антон Яначков
Публикувано на: 08-04-2018, 10:42
Quote Post



Име: Антон Яначков
Група: Потребител
Ранг: Старо куче

Мнения: 699
Регистриран на: 27.07.16



QUOTE (Sta82 @ 06-04-2018, 18:37)
Също ако видя, че на някой му трябва помощ и знам отговора на въпроса, също бих помогнал фор фрии.

Похвално намерение! Как да не отдели човек малко време при такива условия. Ето така твоите квадратчета няма да излизат извън видимата част на браузера:
CODE

<!DOCTYPE html>
<html>
<head>
<title>Homework 8</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css?family=Saira+Extra+Condensed" rel="stylesheet">
<link type="text/css" href="styles/styles.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">



<style>
* {
margin: 0px;
padding: 0px;
}
body {
background-color: black;
}
nav {
background-color: gray;
font-family: Arial, Helvetica, sans-serif;
}
nav ul li {
display: inline-block;
position: relative;
height:40px;
}
nav ul li:hover ul {
display:block;
}
nav ul li ul {
display:none;
position:absolute;
left:0;
top:40px;
width:89px;
background:grey;
}
nav ul li a {
color:#fff;
text-decoration:none;
height:40px;
line-height:40px;
display:inline-block;
padding-left:10px;
padding-right:10px;
}
nav ul li a:hover {
background-color:red;
}


@-webkit-keyframes rotating /* Safari and Chrome */ {
from {
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(-1440deg);
-o-transform: rotate(-1440deg);
transform: rotate(-1440deg);
}
0% {left:1vw; top:8vh;}
25% {left:92vw; top:8vh;}
50% {left:92vw; top: 87vh;}
75% {left:1vw; top:87vh;}
100% {left:1vw; top:8vh;}
}
@keyframes rotating {
from {
-ms-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-ms-transform: rotate(-1440deg);
-moz-transform: rotate(-1440deg);
-webkit-transform: rotate(-1440deg);
-o-transform: rotate(-1440deg);
transform: rotate(-1440deg);
}
0% {left:1vw; top:8vh;}
25% {left:92vw; top:8vh;}
50% {left:92vw; top: 87vh;}
75% {left:1vw; top:87vh;}
100% {left:1vw; top:8vh;}
}



div.firstBox, div.secondBox {
-webkit-animation: rotating 1s linear infinite;
-moz-animation: rotating 6s linear infinite;
-ms-animation: rotating 6s linear infinite;
-o-animation: rotating 6s linear infinite;
animation: rotating 6s linear infinite;
animation-name: rotating;
-animation-duration: 6s;
animation-iteration-count: infinite;
position: fixed;
width: 6.6vw;
height: 10vh;
line-height: 10vh;
font-size: 2vw;

text-align: center;
background-color: yellow;
color: red;
}
div.secondBox {
background-color: red;
color: yellow;
animation-delay: 3s;
}

</style>

</head>
<body>


<nav>
<ul>
<li><a href="#" title="External URL">Home</a></li>
<li><a href="#">About</a></li>
<li>
<a href="#">Products<i class="fa fa-caret-down"></i></a>
<ul>
<li><a href="#">Product 1</a></li>
<li><a href="#">Product 2</a></li>
<li><a href="#">Product 3</a></li>
</ul>
</li>
</ul>
</nav>


<div class="firstBox">
Rotate
</div>

<div class="secondBox">
Rotate
</div>


</body>
</html>

Когато правиш нещо responsive не смесвай мерните единици. Пиксела е неподходящ за такива цели.
PMEmail PosterUsers Website
Top
Sta82
Публикувано на: 10-04-2018, 22:17
Quote Post



Име:
Група: Потребител
Ранг: Новопостъпил

Мнения: 14
Регистриран на: 28.02.18



QUOTE (Антон Яначков @ 08-04-2018, 10:42)
QUOTE (Sta82 @ 06-04-2018, 18:37)
Също ако видя, че на някой му трябва помощ и знам отговора на въпроса, също бих помогнал фор фрии.

Похвално намерение! Как да не отдели човек малко време при такива условия. Ето така твоите квадратчета няма да излизат извън видимата част на браузера:
CODE

<!DOCTYPE html>
<html>
<head>
<title>Homework 8</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css?family=Saira+Extra+Condensed" rel="stylesheet">
<link type="text/css" href="styles/styles.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">



<style>
* {
margin: 0px;
padding: 0px;
}
body {
background-color: black;
}
nav {
background-color: gray;
font-family: Arial, Helvetica, sans-serif;
}
nav ul li {
display: inline-block;
position: relative;
height:40px;
}
nav ul li:hover ul {
display:block;
}
nav ul li ul {
display:none;
position:absolute;
left:0;
top:40px;
width:89px;
background:grey;
}
nav ul li a {
color:#fff;
text-decoration:none;
height:40px;
line-height:40px;
display:inline-block;
padding-left:10px;
padding-right:10px;
}
nav ul li a:hover {
background-color:red;
}


@-webkit-keyframes rotating /* Safari and Chrome */ {
from {
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(-1440deg);
-o-transform: rotate(-1440deg);
transform: rotate(-1440deg);
}
0% {left:1vw; top:8vh;}
25% {left:92vw; top:8vh;}
50% {left:92vw; top: 87vh;}
75% {left:1vw; top:87vh;}
100% {left:1vw; top:8vh;}
}
@keyframes rotating {
from {
-ms-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-ms-transform: rotate(-1440deg);
-moz-transform: rotate(-1440deg);
-webkit-transform: rotate(-1440deg);
-o-transform: rotate(-1440deg);
transform: rotate(-1440deg);
}
0% {left:1vw; top:8vh;}
25% {left:92vw; top:8vh;}
50% {left:92vw; top: 87vh;}
75% {left:1vw; top:87vh;}
100% {left:1vw; top:8vh;}
}



div.firstBox, div.secondBox {
-webkit-animation: rotating 1s linear infinite;
-moz-animation: rotating 6s linear infinite;
-ms-animation: rotating 6s linear infinite;
-o-animation: rotating 6s linear infinite;
animation: rotating 6s linear infinite;
animation-name: rotating;
-animation-duration: 6s;
animation-iteration-count: infinite;
position: fixed;
width: 6.6vw;
height: 10vh;
line-height: 10vh;
font-size: 2vw;

text-align: center;
background-color: yellow;
color: red;
}
div.secondBox {
background-color: red;
color: yellow;
animation-delay: 3s;
}

</style>

</head>
<body>


<nav>
<ul>
<li><a href="#" title="External URL">Home</a></li>
<li><a href="#">About</a></li>
<li>
<a href="#">Products<i class="fa fa-caret-down"></i></a>
<ul>
<li><a href="#">Product 1</a></li>
<li><a href="#">Product 2</a></li>
<li><a href="#">Product 3</a></li>
</ul>
</li>
</ul>
</nav>


<div class="firstBox">
Rotate
</div>

<div class="secondBox">
Rotate
</div>


</body>
</html>

Когато правиш нещо responsive не смесвай мерните единици. Пиксела е неподходящ за такива цели.

Хихи, страшно много благодаря. За това с мерните единици не се бях сетил. Как пък няма един емотикон за бира, начи... icon_smile.gif
PMEmail Poster
Top
0 потребители преглеждат тази тема в момента (0 гости, 0 анонимни потребители)
Потребители, преглеждащи темата в момента:

Topic Options Страници: (2) 1 [2]  Reply to this topicStart new topicStart Poll

 


Copyright © 2003-2018 | BG Development | All Rights Reserved
RSS 2.0