CSS Fixed

donsavage

Active Member
Здравейте, мога ли да попитам нещо? Така ето какво ще питам. Разработвам едно сайтче, в което съм сложил един бакграунд, който е fixed, с връзка към фейсубк, туйтер, ютуб ... Въпросът ми е: Как да спирам тази картинка, да не отива до дъното, а да се спира до определено място от мен?

ето пример със този сайт: http://www.hicomputers.eu/bg/ (съжалявам за спама!)
 
От: CSS Fixed

В какъв смисъл до дъното надолу или на страни питаш, ако е настрани се пави най-добре с jquery , а ако искаш да не слиза надолу не ползвай Fixed, а ползвай absolute.
 
От: CSS Fixed

В какъв смисъл до дъното надолу или на страни питаш, ако е настрани се пави най-добре с jquery , а ако искаш да не слиза надолу не ползвай Fixed, а ползвай absolute.

Искам да се движи с курсора на мишката, когато се скролва, а с position: absolute; - това няма да мога. Ще сой на една позиция, а аз искам да се вдижи. Да, искам да му кажа, от къде да почва и къде да спира. Ако му задам bottom: "сстойност". Ще стане ли?
 
От: CSS Fixed

PHP:
$(document).ready(function(){ 
    var windowWidth = document.documentElement.clientWidth;
    var thestyle = windowWidth-1175;
    var nthestyle = thestyle/2;
    $("#slidesharing").css({"left":nthestyle});
    //alert(thestyle);
}); 

$(window).resize(function(){ 
    var windowWidth = document.documentElement.clientWidth;
    var thestyle = windowWidth-1175;
    var nthestyle = thestyle/2;
    $("#slidesharing").css({"left":nthestyle});
    //alert(thestyle);
});
 
От: CSS Fixed

PHP:
$(document).ready(function(){ 
    var windowWidth = document.documentElement.clientWidth;
    var thestyle = windowWidth-1175;
    var nthestyle = thestyle/2;
    $("#slidesharing").css({"left":nthestyle});
    //alert(thestyle);
}); 

$(window).resize(function(){ 
    var windowWidth = document.documentElement.clientWidth;
    var thestyle = windowWidth-1175;
    var nthestyle = thestyle/2;
    $("#slidesharing").css({"left":nthestyle});
    //alert(thestyle);
});

А къде мога да пипам? Не разбирам PHP .... няма м време да го науча... Уча Java, но PHP, скоро едва ли ще е... Ще съм ти благодарен, ако с един коментар ми кажеш, кой елемнт, какво прави.
 
От: CSS Fixed

Това не е PHP, а jQuery - библиотека на javascript. Този код го слагаш между <script> </script> таговете.
 
От: CSS Fixed

PHP:
<script type="text/javascript">
$(document).ready(function(){ 
    var windowWidth = document.documentElement.clientWidth;
    var thestyle = windowWidth-1175;
    var nthestyle = thestyle/2;
    $(".social-sidebar").css({"left":nthestyle});
    //alert(thestyle);
}); 

$(window).resize(function(){ 
    var windowWidth = document.documentElement.clientWidth;
    var thestyle = windowWidth-1175;
    var nthestyle = thestyle/2;
    $(".social-sidebar").css({"left":nthestyle});
    //alert(thestyle);
}); 
</script>

Кода както ти каза колегата не е php, а jquery с две думи точно това което учиш.
Кода прави следното при стартиране на страницата ти взема размера на екрана и ти залепя социалния прозорец на това положение на страни на което искаш да е, същото прави и при ресайзване на самия прозорец.
Предният код по-горе беше само за пример защото не съм знаел, че не можеш да се оправиш сам. Това което е в този пост си е нагласено специално за твоя елемент, като от теб се изисква само да си нагласиш разстоянието на което искаш да е самия социален слайдер. Това става от "var thestyle = windowWidth-1175;", като кода съм си го писал за мен и при теб ширината на сайта може да е съвсем друга не съм се занимавал да я преглеждам. Променяш си и си нагласяш -1075 на колкото ти е угодно на теб и бара ще се залепи. Кода по начина показан в този пост трябва да е в html файловете или за php в echo""; секцията в която ти се принти началото на страницата между <head></head>.
Дано съм бил полезен и да съм обяснил добре.
 
От: CSS Fixed

Добре :)
Още нещо ме затруднява, като гледам кода, къде се пишът имената на картинките, който ще се прилага този ефект ?
 
От: CSS Fixed

Добре :)
Още нещо ме затруднява, като гледам кода, къде се пишът имената на картинките, който ще се прилага този ефект ?

Където са си и сега:
PHP:
<ul class="social-sidebar">
</ul>
 

Горе