Говнокод #7424 — Куча — Говнокод.ру

Говнокод: по колено в коде.

Нашли или выдавили из себя код, который нельзя назвать нормальным, на который без улыбки не взглянешь? Не торопитесь его удалять или рефакторить, — запостите его на говнокод.ру, посмеёмся вместе!

Куча / Говнокод #7424

+126

<div id="scroller">
  <a href="javascript:scroll(0,0)">Наверх</a>
</div>

<style type="text/css">
#scroller {
position:fixed;
left:0px;
top:100%;}

#scroller a {
position:relative;
top:-47px;
padding:5000px 10px 30px 10px;}

#scroller a:hover {background:#d8e3f0;}
</style>

Скролл страницы наверх, прикреплённый к левой границе экрана. Надпись "Наверх" -- внизу экрана. Опускаю блок под экран -- "top:100%", а потом поднимаю ссылочку наверх -- "top:-47px".

Запостил:

opex_jr, 02 Августа 2011

Комментарии (18) RSS

opex_jr 02.08.2011 23:18 # 0

Верный стиль:

#scroller {
position:fixed;
left:0px;
bottom:27px;}

#scroller a {
padding:5000px 10px 30px 10px;}

#scroller a:hover {background:#d8e3f0;}
Ответить
Lure Of Chaos 02.08.2011 23:18 # 0

> top:-47px;
> padding:5000px
рядом смотрится офигитительно - да и просто последнее число = )
Ответить
- opex_jr 02.08.2011 23:20 # 0
  
  Так а это ваще хак) Так и надо. Это и есть прикрепление к левой стороне экрана. Ну можно и поменьше конечно число поставить)
  Ответить
  - Lure Of Chaos 02.08.2011 23:22 # 0
    
    а float и clear на кой?
    да и первое число - верхнее поле, при чем тут оно?
    Ответить
    - opex_jr 02.08.2011 23:27 # 0
      
      Ну сам блок слева внизу в углу. А так до самого верха экрана становится. Так а, кстати, как высоту задать блоку на весь экран? height:100% же не катит.
      Ответить
      - Lure Of Chaos 02.08.2011 23:30 # −1
        
        я че то не понял, в какой угол зажать надо?
        Ответить
        
        opex_jr 02.08.2011 23:33 # −1
        
        http://photo.itgrade.ru/index.php?page=puppies
        Ответить
        
        Lure Of Chaos 02.08.2011 23:38 # −1
        
        понял
        ну во-первых, лучше bottom не в пикселах, а в более шрифто-дружелюбных (ex, em...)
        во-вторых, можно попробовать min-height:100%;
        Ответить
        
        opex_jr 02.08.2011 23:48 # −1
        
        Круто, блоку помог min-height:100%, но ссылка не поддаётся. Без пэддингов, кажется, не обойтись. Ведь нужно, чтобы переход по ссылке срабатывал, даже когда мышь нажимает не на сам текст, а, получается, на пэддинг. Т. е. функциональность нужна <a><div></div><a> такая. Но W3 консорциум запретил так делать) И display:block на ссылке тоже не помогает.
        Ответить
        
        Lure Of Chaos 02.08.2011 23:50 # −1
        
        а если <div></div><a></a>?
        Ответить
        
        opex_jr 03.08.2011 00:02 # −1
        
        Не понял, а зачем так?
        Получилось сейчас
        #scroller {
        position:fixed;
        left:0px;
        bottom:0px;
        height:100%;}
        
        #scroller a {
        padding:10px 10px 10px 10px;
        height:100%;
        display:block;}
        
        Работает так же, только надпись теперь вверху) И что ни мути с top/bottom не получается её к низу прикрепить. Вверху пробел появляется.
        Ответить
        
        Lure Of Chaos 03.08.2011 00:03 # −1
        
        ладно, завтра поиграюсь ) ща спать )
        Ответить
        
        opex_jr 03.08.2011 00:15 # −1
        
        http://peeep.us/3b4db9ff -- код из первого коммента
        http://peeep.us/9ff472a0 -- из предыдущего (тока панель пип.аса закрывает надпись вверху)
        Ответить
  - roman-kashitsyn 02.08.2011 23:33 # 0
    
    Ага, видел в Vaadin такие хаки. только там числа побольше были.
    Ответить
- sectus 03.08.2011 10:16 # 0
  
  Добрый сегодня?
  Ответить

Yurik 03.08.2011 00:32 # −1

<html>
	<head>
		<style type="text/css" media="all">
			body, p {
				margin: 0;
			}
			
			#scroller {
				position: fixed;
				float: left;
				height: 100%;
				width: 100px;
				background: grey;
			}

			#scroller a {
				height: 100%;
				display: block;
			}
			
			#scroller p {
				padding: 10px;
				position: absolute;
				bottom: 0px;
			}
		</style>
	</head>
	
	<div id="scroller">
	  <a href="#top"><p>Наверх</p></a>
	</div>
</html>

Рекомендую задавать такие вопросы на StackOverflow.
Саундтрек: youtu.be/LEp8HWKeQ_8

Ответить

Yurik 03.08.2011 00:46 # 0

Пожалуй, единственный минус только в том, что нужно указывать ширину блока самому.
Ответить

none1 25.08.2021 08:43 # 0

Вот Маринку, или других баб, постоянно надо было просить да упрашивать, да корректировать и учить. А тут пацан (!) выполнял такое, о чём я и сам не знал, что так можно. И первый раз видел, чтобы сосали с таким энтузиазмом, стараясь и смотря мне прямо в глаза... Это что-то нереальное, да у него на лице написано крупными буквами: "Мне! Это! Самому! Нравится!"
Ответить

Говнокод: по колено в коде.

Куча / Говнокод #7424

Комментарии (18) RSS

Добавить комментарий