<MyRusakov.ru />

Создание крупного проекта на Java с нуля

Создание крупного проекта на Java с нуля

Данный курс научит Вас создавать крупные проекты на Java грамотно и быстро. В курсе Вы увидите создание большой и сложной программы на Java абсолютно с нуля.

В начале курса у нас будет только идея, а в конце готовый продукт, который можно использовать в практических целях.

В рамках упражнений курса Вы параллельно со мной будете создавать свою большую программу на Java, что даст Вам необходимую практику, после которой для Вас уже не будет разницы, какого размера создавать программы.

Подробнее
Подписка

Подписавшись по E-mail, Вы будете получать уведомления о новых статьях.

Подписка Подписаться

Добавляйтесь ко мне в друзья ВКонтакте! Отзывы о сайте и обо мне оставляйте в моей группе.

Мой аккаунт Мой аккаунт Моя группа
Опрос

Каким движком Вы предпочитаете пользоваться?

Форум сайта MyRusakov.ru

Кнопка наверх без jQuery
26.11.2013 17:24:00 Кнопка наверх без jQuery Сообщение #1
ilyadenisovid

ilyadenisovid

Мастер

Мастер

Дата регистрации:
28.01.2013 18:32:29

Сообщений: 213

Здравствуйте! Делаю кнопку 'наверх' на сайт, нужно сделать без jQuery, но с JS. JS нужен для того, чтобы кнопка появлялась только если страница прокручена вниз. Делдаю так, но не выходит.

<script type = "text/javascript">
var top = document.documentElement.scrollTop;
if (top <> '0') document.write('<div id = "up"><a href = "#" title = "Наверх">↑ Наверх</a></div>');
</script>
Профиль Ответить
26.11.2013 18:53:13 Кнопка наверх без jQuery Сообщение #2
tikkiwiki

tikkiwiki

Модератор

Модератор

Дата регистрации:
15.11.2013 15:36:59

Сообщений: 194

Здравствуйте ilyadenisovid. Есть решение:


HTML:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="scriptjava.js"></script>
<title>Стрелка вверх вниз</title>
</head>

<body>
<script type="text/javascript">
(function () {
var page_up_div;
var page_up_key;
var page_up_nokey;
var page_up_div_create = function () {
page_up_div = $$i({
create:'div',
attribute: {},
insert:$$().body
}).$$('position','fixed').$$('top',($$s.clientsize().h-50)+'px').$$('left',($$s.scrollpos().l+$$s.clientsize().w-67)+'px').$$('zIndex','5').$$('width','14px').$$('height','7px').$$('backgroundImage','url(updown.png)').$$('backgroundPosition','0 0').$$('backgroundRepeat','no-repeat').$$('cursor','pointer');
}

var page_up_timer = function () {
if(page_up_nokey) {
if($$s.scrollpos().t>=0 && $$s.scrollpos().t<=300) {
$$(page_up_div).$$('visibility','hidden');
}
else if($$s.scrollpos().t>300 && $$s.scrollpos().t<=1000) {
page_up_key=false;
$$(page_up_div).$$('visibility','visible').$$('top','50px').$$('left',($$s.scrollpos().l+$$s.clientsize().w-67)+'px').$$('backgroundPosition','0 -7px');
}
else if($$s.scrollpos().t>1000) {
page_up_key=true;
$$(page_up_div).$$('visibility','visible').$$('top',($$s.clientsize().h-50)+'px').$$('left',($$s.scrollpos().l+$$s.clientsize().w-67)+'px').$$('backgroundPosition','0 0');
}
}
}

var pos_top,z;
var page_up_to_up_go = function () {
if(page_up_key) {
pos_top=pos_top-z;
z=z+10;
if(pos_top<0) {
page_up_nokey=true;
pos_top=0;
}
window.scrollTo(0, pos_top);
if(pos_top>0) {
setTimeout(function() { page_up_to_up_go(); },10);
}
}
else {
pos_top=pos_top+z;
z=z+10;
if(pos_top>=($$s.scrollsize().h-$$s.clientsize().h)) {
page_up_nokey=true;
pos_top=($$s.scrollsize().h-$$s.clientsize().h);
}
window.scrollTo(0, pos_top);
if(pos_top<($$s.scrollsize().h-$$s.clientsize().h)) {
setTimeout(function() { page_up_to_up_go(); },10);
}
}
}

var page_up_to_up = function (event) {
page_up_nokey=false;
z=10;
pos_top=$$s.scrollpos().t;
setTimeout(function() { page_up_to_up_go(); },10);
}

$$r(function() {
if(($$s.scrollsize().h-$$s.clientsize().h)>1000) {
page_up_nokey=true;
page_up_div_create();
$$e.add($$(page_up_div),'click',page_up_to_up);
page_up_timer();
setInterval(function() { page_up_timer(); },100);
}
});
})();
</script>
Немного прокрути скроллинг вниз, справа появится стрелка.<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
1<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
2<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
3<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
4<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
5<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
6<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
7<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
8<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
9<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
10<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
11<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
12<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
13<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
14<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
15<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
16<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
17<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
18<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
19<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
20<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
21<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
22<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
23<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
24<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
25<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
26<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
27<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
28<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
29<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
30<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
</body>
</html>


scriptjava.js



/**
* scriptjava.js
* save time
* scriptjava.ru
* scriptjava.net
* scriptjava.org
*/

var _$$={
version:20120201,
$:function () {
var obj;
switch(arguments.length) {
case 0:
return document;
break;
case 2:
_$$.$(arguments[0]).innerHTML=arguments[1];
break;
case 3:
_$$.$(arguments[0]).style[arguments[1]]=arguments[2];
break;
}
if(arguments.length>0) {
if(typeof arguments[0] == 'string') {
obj=_$$.$().getElementById(arguments[0]);
}
else {
obj=arguments[0];
}
}
obj.$$ = function() {
switch(arguments.length) {
case 0:
this.$$ = function () {
return _$$.$.apply(null,arguments);
}
break;
case 1:
obj.innerHTML=arguments[0];
break;
case 2:
obj.style[arguments[0]] = arguments[1];
break;
case 3:

break;
}
return obj;
};
return obj;
},
$a:function (arg) {
arg = arg || {};

var default_arg = {
type:'get',
url:'',
data:{},
response:'text',
header:{
'Content-Type':'application/x-www-form-urlencoded; charset=windows-1251',
'Referer':location.href
},
async:true,
username:'',
password:'',
errrep:true,
error:function(num) {
var arr=['Your browser does not support Ajax',
'Request failed',
'Address does not exist',
'The waiting time left'];

alert(arr[num]);
},
status:function (number) {

},
endstatus:function (number) {

},
success:function (data) {

},
timeout:5000
}

for(var index in default_arg) {
if(typeof arg[index] == "undefined" arg[index] = default_arg[index];
}


var type = arg['type'];
var url = arg['url'];
var data = arg['data'];
var response = arg['response'];
var header = arg['header'];
var async = arg['async'];
var username = arg['username'];
var password = arg['password'];
var errrep = arg['errrep'];
var error = arg['error'];
var status = arg['status'];
var endstatus = arg['endstatus'];
var success = arg['success'];
var timeout = arg['timeout'];


var obj = function () {
var req = null;
if (window.XMLHttpRequest) {
try {
req = new XMLHttpRequest();
}
catch (e){
}
}
else if (window.ActiveXObject) {
try {
req = new ActiveXObject('Msxml2.XMLHTTP');
}
catch (e) {
try {
req = new ActiveXObject('Microsoft.XMLHTTP');
}
catch (e) {
}
}
}
return req;
}


var encurl=function (d) {
var query = [];
if (d instanceof Object) {
for (var k in d) {
query.push(encodeURIComponent(k) + '=' + encodeURIComponent(d[k]));
}
return query.join('&');
}
else {
return encodeURIComponent(d);
}
}


var parsehead = function(headertxt) {
var headers = {};
var ls = /^\s*/;
var ts = /\s*$/;
var lines = headertxt.split("\n";
for(var i = 0; i < lines.length; i++) {
var line = lines[i];
if (line.length == 0) continue;
var pos = line.indexOf(':');
var name = line.substring(0, pos).replace(ls, "".replace(ts, "";
var value = line.substring(pos+1).replace(ls, "".replace(ts, "";
headers[name] = value;
}
return headers;
}


var req=obj();

if(req!==null) {

var fullurl=url+'?'+encurl(data);

if(type=='get') {
(username=='' && password=='') ? req.open("GET", fullurl, async) : req.open("GET", fullurl, async, username, password);
}
else if(type=='post') {
(username=='' && password=='') ? req.open("POST", url, async) : req.open("POST", url, async, username, password);
}
else if(type=='head') {
(username=='' && password=='') ? req.open("HEAD", fullurl, async) : req.open("HEAD", fullurl, async, username, password);
}

if (header instanceof Object) {
for(var key in header) {
req.setRequestHeader(key,header[key]);
}
}


if(!async) {

if(type=='get' || type=='head') {
req.send(null);
}
else if(type=='post') {
req.send(encurl(data));
}


endstatus(req.status);

if(req.status == 200) {

if(type=='get' || type=='post') {
if(response=='text') {
success(req.responseText);
}
else if(response=='xml') {
success(req.responseXML);
}
}
else if(type=='head') {
success(parsehead(req.getAllResponseHeaders()));
}

}
else if(req.status == 404) {
if(errrep) {error(2);}
}
else {
if(errrep) {error(1);}
}


}
else {

req.onreadystatechange = function () {

status(req.readyState);

if(req.readyState == 4) {

if(reqtime) {
clearTimeout(reqtime);
}

endstatus(req.status);

if(req.status == 200) {

if(type=='get' || type=='post') {
if(response=='text') {
success(req.responseText);
}
else if(response=='xml') {
success(req.responseXML);
}
}
else if(type=='head') {
success(parsehead(req.getAllResponseHeaders()));
}

}
else if(req.status == 404) {
if(errrep) {error(2);}
}
else {
if(errrep) {error(1);}
}
}

}

if(type=='get' || type=='head') {
req.send(null);
}
else if(type=='post') {
req.send(encurl(data));
}


if(timeout>0) {
var reqtime = setTimeout(function () { if(req.readyState!=4) { req.abort(); if(errrep) {error(3);} } }, timeout);
}

}


}
else {
if(errrep) {error(0);}
}

},
$c:{
set: function(cookie_name, cookie_value, cookie_expires, cookie_path, cookie_domain, cookie_secure) {
if(cookie_name!==undefined) {
cookie_expires=cookie_expires || 0;
var expire_date = new Date;
expire_date.setTime(expire_date.getTime() + (cookie_expires*1000));
_$$.$().cookie = cookie_name + "=" + encodeURIComponent(cookie_value)+'; ' +
((cookie_expires === undefined) ? '' : 'expires=' + expire_date.toGMTString()+'; ') +
((cookie_path === undefined) ? 'path=/;' : 'path='+cookie_path+'; ') +
((cookie_domain === undefined) ? '' : 'domain='+cookie_domain+'; ') +
((cookie_secure === true) ? 'secure; ' : '');
}
},
get: function(cookie_name) {
var cookie = _$$.$().cookie, length = cookie.length;
if(length) {
var cookie_start = cookie.indexOf(cookie_name + '=');
if(cookie_start != -1) {
var cookie_end = cookie.indexOf(';', cookie_start);
if(cookie_end == -1) {
cookie_end = length;
}
cookie_start += cookie_name.length + 1;
return decodeURIComponent(cookie.substring(cookie_start, cookie_end));
}
}
},
erase: function(cookie_name) {
this.set(cookie_name, '', -1);
},
test: function() {
this.set('test_cookie', 'test', 10);
var work = (this.get('test_cookie') === 'test') ? true : false;
this.erase('test_cookie');
return work;
}
},
$e:{
add:function(elem, type, handler) {
if(elem.event_list==undefined) elem.event_list = {};
if(elem.event_list[type]==undefined) {
elem.event_list[type] = [];
var func = function(event) {
var event = event||window.event;
var list = elem.event_list[type];
for(var i in list) {
list[i](event);
}
}
if(elem.addEventListener) {
elem.addEventListener(type,func,false);
}
else if(elem.attachEvent) {
elem.attachEvent('on'+type,func);
}
else {
elem['on'+type] = func;
}
}
var list = elem.event_list[type];
var exist = false;
for(var i in list) {
if(list[i]==handler) exist = true;
}
if(!exist) {
elem.event_list[type].push(handler);
}
},
remove:function(elem, type, handler) {
if(elem.event_list==undefined) return false;
if(elem.event_list[type]==undefined) return false;
var list = elem.event_list[type];
for(var i in list) {
if(list[i]==handler) {
list = list.splice(i,1);
return true;
}
}
return false;
}
},
$f:function (arg) {
arg = arg || {};
var default_arg = {
formid:'',
url:'',
onstart:function () {

},
onsend:function () {

}
}

for(var index in default_arg) {
if(typeof arg[index] == "undefined" arg[index] = default_arg[index];
}

var formid = arg['formid'];
var url = arg['url'];
var onsend = arg['onsend'];
var onstart = arg['onstart'];

var id='f' + _$$.$s.randnum(0,1000000);

var div=_$$.$i({
create:'div',
attribute: {},
insert:_$$.$().body
});


div.innerHTML = '<iframe style="width:250px;height:200px;" src="about:blank" id="'+id+'" name="'+id+'" onload="if(this.onsendcomplete) {if(this.contentDocument) {var d = this.contentDocument;}else if(this.contentWindow) {var d = this.contentWindow.document;}else {var d = window.frames[this.id].document;}if(d.location.href != \'about:blank\') {this.onsendcomplete();}}"></iframe>';
div.style.display='none';

_$$.$(id).onsendcomplete = function() { onsend(); };

_$$.$(formid).setAttribute('target', id);
_$$.$(formid).setAttribute('action', url);
_$$.$(formid).submit();
onstart();

return div;
},
$i:function (arg) {
arg = arg || {};
var default_arg = {
create:'script',
attribute: {
'type':'text/javascript'
},
insert:_$$.$().body,
onready:function () {

}
}

for(var index in default_arg) {
if(typeof arg[index] == "undefined" arg[index] = default_arg[index];
}

var create = arg['create'];
var attribute = arg['attribute'];
var insert = arg['insert'];
var onready = arg['onready'];

var s = _$$.$().createElement(create);

for(var key in attribute) {
s.setAttribute(key,attribute[key]);
}

if(create=='script' && (typeof attribute.src != "undefined") {
if (s.readyState) {
s.onreadystatechange = function() {
if(s.readyState == "loaded" || s.readyState == "complete" {
s.onreadystatechange = null;
onready();
}
}
}
else {
s.onload = function() {
onready();
}
}
}

insert.appendChild(s);

if(create=='script' && (typeof attribute.src == "undefined") {
s.$$=function () {
s.text=arguments[0];
}
}
else if(create=='style') {
s.$$=function () {
if(s.styleSheet) {
s.styleSheet.cssText = _$$.$().createTextNode(arguments[0]).nodeValue;
}
else {
s.appendChild(_$$.$().createTextNode(arguments[0]));
}
}
}
else {
return _$$.$(s);
}

return s;
},
$r:{
rl:[],
or:function (handler) {

if (!_$$.$r.rl.length) {
_$$.$r.br(function() {
for(var i=0; i<_$$.$r.rl.length; i++) {
_$$.$r.rl[i]();
}
});
}

_$$.$r.rl.push(handler);
},
br:function (handler) {

var called = false;

var ready = function () {
if (called) return;
called = true;
handler();
}

if (document.addEventListener) {
document.addEventListener("DOMContentLoaded", function(){
document.removeEventListener( "DOMContentLoaded", arguments.callee, false);
ready();}, false);
}
else if(document.attachEvent) {
if(document.documentElement.doScroll && window == window.top) {
var tryScroll = function (){
if (called) {
return;
}
try {
document.documentElement.doScroll("left";
ready();
}
catch(e) {
setTimeout(tryScroll, 10);
}
}
tryScroll();
}

document.attachEvent("onreadystatechange", function(){
if (document.readyState === "complete" {
document.detachEvent( "onreadystatechange", arguments.callee);
ready();
}
});
}


if(window.addEventListener) {
window.addEventListener('load', ready, false);
}
else if(window.attachEvent) {
window.attachEvent('onload', ready);
}
else {
window.onload=ready;
}
}

},
$s:{
screensize:function () {
return {"w":screen.width,"h":screen.height};
},
windowpos:function () {
if (window.screenLeft || window.screenTop) {
return {"l":window.screenLeft,"t":window.screenTop};
}
else if (window.screenX || window.screenY) {
return {"l":window.screenX,"t":window.screenY};
}
else {
return {"l":0,"t":0};
}
},
clientsize:function () {
if (window.innerWidth || window.innerHeight) {
return {"w":window.innerWidth,"h":window.innerHeight};
}
else if (_$$.$().documentElement && (_$$.$().documentElement.clientWidth || _$$.$().documentElement.clientHeight)) {
return {"w":_$$.$().documentElement.clientWidth,"h":_$$.$().documentElement.clientHeight};
}
else if (_$$.$().body.clientWidth || _$$.$().body.clientHeight) {
return {"w":_$$.$().body.clientWidth,"h":_$$.$().body.clientHeight};
}
else {
return {"w":0,"h":0};
}
},
scrollpos:function () {
if (window.innerWidth || window.innerHeight) {
return {"l":window.pageXOffset,"t":window.pageYOffset};
}
else if (_$$.$().documentElement && (_$$.$().documentElement.clientWidth || _$$.$().documentElement.clientHeight)) {
return {"l":_$$.$().documentElement.scrollLeft,"t":_$$.$().documentElement.scrollTop};
}
else if (_$$.$().body.clientWidth || _$$.$().body.clientHeight) {
return {"l":_$$.$().body.scrollLeft,"t":_$$.$().body.scrollTop};
}
else {
return {"l":0,"t":0};
}
},
scrollsize:function () {
if (_$$.$().documentElement && (_$$.$().documentElement.scrollWidth || _$$.$().documentElement.scrollHeight)) {
return {"w":_$$.$().documentElement.scrollWidth,"h":_$$.$().documentElement.scrollHeight};
}
else if (_$$.$().body.scrollWidth || _$$.$().body.scrollHeight) {
return {"w":_$$.$().body.scrollWidth,"h":_$$.$().body.scrollHeight};
}
else {
return {"w":0,"h":0};
}
},
mousepos:function (e) {
var x = 0, y = 0;
if (!e) e = window.event;
if (e.pageX || e.pageY){
x = e.pageX;
y = e.pageY;
}
else if (e.clientX || e.clientY) {
x = e.clientX+this.scrollpos().l-_$$.$().documentElement.clientLeft;
y = e.clientY+this.scrollpos().t-_$$.$().documentElement.clientTop;
}
return {"x":x, "y":y};
},
mouseelpos:function (e) {
var x = 0, y = 0;
if (!e) e = window.event;
if (e.layerX || e.layerY) {
x = e.layerX;
y = e.layerY;
}
else if (e.offsetX || e.offsetY) {
x = e.offsetX;
y = e.offsetY;
}
return {"x":x, "y":y};
},
elementpos:function (el) {
var l = 0, t = 0;
while (el) {
l += el.offsetLeft;
t += el.offsetTop;
el = el.offsetParent;
}
return {"l":l, "t":t};
},
getelbyclass:function (n,t) {
t = t || '*';
var elms=[], relm=[];
elms=_$$.$().getElementsByTagName(t);
for(var i=0;i<elms.length;i++) {
if (elms[i].className==n) {
relm.push(elms[i]);
}
}
return relm;
},
getelbytag:function (t) {
t = t || '*';
var elms=[], relm=[];
elms=_$$.$().getElementsByTagName(t);
for(var i=0;i<elms.length;i++) {
relm.push(elms[i]);
}
return relm;
},
getelbyname:function (n,t) {
t = t || '*';
var elms=[], relm=[];
elms=_$$.$().getElementsByTagName(t);
for(var i=0;i<elms.length;i++) {
if(elms[i].getAttribute('name')==n) {
relm.push(elms[i]);
}
}
return relm;
},
geteventtype:function (e) {
if (!e) e = window.event;
return e.type;
},
mousebutton:function (e) {
if(e.which == null) {
return (e.button < 2) ? "left" : ((e.button == 4) ? "middle" : "right";
}
else {
return (e.which < 2) ? "left" : ((e.which == 2) ? "middle" : "right";
}
},
randnum: function(rmin, rmax) {
return Math.floor(Math.random() * (rmax - rmin + 1)) + rmin;
},
browsername: function () {
var useragent=navigator.userAgent;
var navigatorname;
if(useragent.indexOf('MSIE')!= -1) {
navigatorname="MSIE";
}
else if(useragent.indexOf('Safari')!= -1) {
if(useragent.indexOf('Chrome')!= -1) {
navigatorname="Chrome";
}
else {
navigatorname="Safari";
}
}
else if(useragent.indexOf('Gecko')!= -1) {
if(useragent.indexOf('Chrome')!= -1) {
navigatorname="Chrome";
}
else {
navigatorname="Mozilla";
}
}
else if(useragent.indexOf('Mozilla')!= -1) {
navigatorname="Old Netscape or Mozilla";
}
else if(useragent.indexOf('Opera')!= -1) {
navigatorname="Opera";
}
return navigatorname;
}
}
};

var $ver=_$$.version;
var $$=_$$.$;
var $$a=_$$.$a;
var $$c=_$$.$c;
var $$e=_$$.$e;
var $$f=_$$.$f;
var $$i=_$$.$i;
var $$r=_$$.$r.or;
var $$s=_$$.$s;



Картинка за Вами...
Профиль Ответить
26.11.2013 18:59:57 Кнопка наверх без jQuery Сообщение #3
ilyadenisovid

ilyadenisovid

Мастер

Мастер

Дата регистрации:
28.01.2013 18:32:29

Сообщений: 213

Извините, модератор, но за чем скачивать из интернета какой-то бездарный скрипт, у данного вопроса, есть простое решение, а вот это я уже находил в интернете, тем более сторонняя библиотека подключается. Единственное, что тут нужно, проверить, если верхняя координата не равна 0, то появляется ссылка. Проблема только в коде. На будущее, не стоит несмотря скачивать скрипт из интернета.
Профиль Ответить
26.11.2013 20:55:20 Кнопка наверх без jQuery Сообщение #4
tikkiwiki

tikkiwiki

Модератор

Модератор

Дата регистрации:
15.11.2013 15:36:59

Сообщений: 194

Уважаемый ilyadenisovid, так пользуйтесь интернетом и решите Вашу проблему. Я не знаю на сколько Вы "умны", может Вы не умеете пользоваться интернетом.
На будущее- не стоит умничать.
Профиль Ответить
27.11.2013 00:52:12 Кнопка наверх без jQuery Сообщение #5
alexandrdante

alexandrdante

Модератор

Модератор

Дата регистрации:
15.11.2013 15:33:40

Сообщений: 207

а зачем Вам скрипты вообще?
сделайте якорь вверху,потом просто кнопку вставьте,в position:fixed

только в див какой-нибудь,который будет появляться когда чуть ниже опустится экран
Профиль Ответить
27.11.2013 06:43:01 Кнопка наверх без jQuery Сообщение #6
ilyadenisovid

ilyadenisovid

Мастер

Мастер

Дата регистрации:
28.01.2013 18:32:29

Сообщений: 213

Я и говорю, мне скрипт не нужен. Мне нужно буквально пару строчек js, нужно узнать если верхняя координата не 0(то есть пользователь прокрутил страницу), то появляется кнопка. Просто неинтересно, когда кнопка даже в начале страницы висит
Профиль Ответить
27.11.2013 15:18:15 Кнопка наверх без jQuery Сообщение #7
alexandrdante

alexandrdante

Модератор

Модератор

Дата регистрации:
15.11.2013 15:33:40

Сообщений: 207

тогда так:

<a href="#" title="Вернуться к началу" class="topbutton">^Наверх</a>



.topbutton {
width:100px;
border:2px solid #ccc;
background:#f7f7f7;
text-align:center;
padding:10px;
position:fixed;
bottom:50px;
right:50px;
cursor:pointer;
color:#333;
font-family:verdana;
font-size:12px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
}



В стилях можно поиграться немного,например процентное соотношение отступа кнопки от верхней части экрана.Чтобы её сразу же не было видно на экране.


Плавного появления и прокрутки без скриптов не выйдет.
Пробовал пару способов,но безуспешно



с border-radius просто привычка добавлять -moz -webkit =)
Профиль Ответить
27.11.2013 15:33:50 Кнопка наверх без jQuery Сообщение #8
alexandrdante

alexandrdante

Модератор

Модератор

Дата регистрации:
15.11.2013 15:33:40

Сообщений: 207

Нашёл такую реализацию.
С плавным движением

<div id="scrollup"><img class="up" alt="Прокрутить вверх" src="/img/up.png" /></div>


#scrollup {
position: fixed; /* фиксированная позиция */
opacity: 0.8; /* прозрачность */
padding: 15px 10px 10px; /* отступы */
background: #aaa;
border-radius: 5px; /* скругление углов */
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
left: 10px; /* отступ слева */
bottom: 10px; /* отступ снизу */
display: none; /* спрятать блок */
cursor: pointer;
}



ну и простенький яваскрипт:
window.onload = function() { // после загрузки страницы

var scrollUp = document.getElementById('scrollup'); // найти элемент

scrollUp.onmouseover = function() { // добавить прозрачность
scrollUp.style.opacity=0.3;
scrollUp.style.filter = 'alpha(opacity=30)';
};

scrollUp.onmouseout = function() { //убрать прозрачность
scrollUp.style.opacity = 0.5;
scrollUp.style.filter = 'alpha(opacity=50)';
};

scrollUp.onclick = function() { //обработка клика
window.scrollTo(0,0);
};

// show button

window.onscroll = function () { // при скролле показывать и прятать блок
if ( window.pageYOffset > 0 ) {
scrollUp.style.display = 'block';
} else {
scrollUp.style.display = 'none';
}
};
};




как видите,тут используется ScrollUp ScrollTo
Профиль Ответить
27.11.2013 16:55:21 Кнопка наверх без jQuery Сообщение #9
ilyadenisovid

ilyadenisovid

Мастер

Мастер

Дата регистрации:
28.01.2013 18:32:29

Сообщений: 213

У меня с CSS проблем не было, все было как у Вас, функции прозрачности я убрал, все делаю правильно, но вообще теперь блок не появляется.
window.onload = function() {
var scrollUp = document.getElementById('up');
window.onscroll = function () {
if (window.pageYOffset > 0) {
scrollUp.style.display = 'block';
}
else {
scrollUp.style.display = 'none';
}
};
};
Профиль Ответить
27.11.2013 20:14:27 Кнопка наверх без jQuery Сообщение #10
alexandrdante

alexandrdante

Модератор

Модератор

Дата регистрации:
15.11.2013 15:33:40

Сообщений: 207

можно весь код глянуть,со стилями?
может где-то забыли что-то.
а попробуйте с прозрачностью =)
Там же просто opacity
парой строк больше)


буду пробовать работу без прозрачности.Ожидайте.

И там в стилях через картинку реализация:вы так делали? или нет?
Профиль Ответить