Prośba o prztłumaczenie...

Azure 114Azure TPBlueSkiesEnterprise TPInvazionlightning01_tpMovies07OutlinePhobosSMF Default ThemeTPStyle_11X-Mas

[06.01.2011, 16:54:10]

[31.12.2010, 07:06:05]

[08.12.2010, 17:21:30]

[11.11.2010, 05:20:40]

[04.11.2010, 19:48:16]

[29.05.2010, 19:00:18]

[10.05.2010, 05:50:46]

[06.05.2010, 05:40:10]

[18.12.2009, 08:03:05]

[06.12.2009, 13:55:49]

[pyot]

Witam.
Proszę o przetłumaczenie mi na język zrozumiały dla mnie- czyli PL,jak mam osadzić skrypty w dokumencie abym mógł stworzyć galerie podane niżej.
Znam co nieco html/css ale tu poległem

proszę o pomoc za co dziękuję

http://herr-schuessler.de/blog/jquerypopeye-an-inline-lightbox-alternative/
http://www.no-margin-for-errors.com/projects/prettyGallery/

Pozdrawiam.

[Rico Roco]

Cześć Pyot!

jQuery to dość zaawansowany framwerk. Galerii opartych na efekcje lightboxa jest trochę w sieci..

mam takie pytania..

- do czego chcesz urzyć galerii i w jaki sposób?
=> tzn. czy chcesz wrzucać churtowo foty? czy pojedyńczo, czy dynamicznie, czyli też potrzebne info gdzie? na jakiś blog, forum, inny CMS, czy stronkę statyczną?

jak mam osadzić skrypty w dokumencie abym mógł stworzyć galerie podane niżej.

z tego zrozumiałem, że raczej chodzi o stronkę statyczną, na której chcesz umieścić trochę fotek z efektem lightboxa, czy tak?

Potrzeba mi więcej informacji, i jest to ważne, ponieważ jest tyle możliwości, że nie wiem co Ci odpisac..

Teraz jestem w rozjazdach i piszę z iPacka, ale nocką ściągnę na chatę, to przemyśle sprawę, tylko potrzeba mi informacji od ciebie, ew pliki w które chcesz osadzić galerię..

Pozdrawiam i tymczasem
roco

[pyot]

Chodzi o najzwyczajniejsze osadzenie w html.
 Poradzę sobie z każdorazowym dodaniem ręcznie zdjęcia tak pełnego,jak i miniatury.
Sęk w tym,że nie umiem się za to zabrać,wklejam z podanych stron skrypty,ale pewnie wklejam nie tam gdzie trzeba,bo na js nie znam się nic a nic.
Gdybyś był łaskaw ot przetłumaczyć co gdzie...
Jeżeli znasz z kolej jakiś program dla laika oparty na tym i podobnym skrypcie pozwalający dodawać fotki  z jekiegoś panelu - do już utworzonej galerii,byłbym wdzięczny o  namiar choć to nie dla mnie akurat.
Niemniej zainteresowany jestem jqery,tym co podesłałem...
Nie śpiesz się,szanuję Twój czas więc uzbroję się w cierpliwość.
Pozdrawiam.

[Rico Roco]

Przy takich wynalazkach procedury są proste i nieskaplikowane, za to daje to sporo możliwości, np. punktowej prezentacji w jakimś dokumencie np. kilku fotek..

Generalnie, to trzeba wrzucić na server foldery z JS, czyli zewnętrzymi skryptami, folder z css, od lightboxa, folderem z graficzkami, które ten skrypt potrzebuje.. -> to wrzycasz na server, w katalogu w którym masz swoją stronę html, a w html'u w sekcji head odwołujesz się do skryptów i styli lightboxa.

I teraz w zależności od skryptu, bo jest ich kilka, i akurat ten od pretty gallery może być dość trudny w obsłudze.., to przy klasycznym lightboxie, dajesz klasycznego linka z rel = lightbox i opisem czyli atrybutem title = i dajesz do tego linka obrazek miniatury.. naprawdę proste jak konstrukcja cepa..

Zobaczę co ja mam w swoich skryptach, a mam wiele GB..

Takiego klasycznego lightboxa możesz zobaczyć tu u mnie na forum w Gallerii:  http://ricoroco.com/forum/index.php?action=gallery;cat=1 i jest to tak rozwiązane, że kiedy kilkasz direct na miniaturę foty, to masz możilowść po odpaleniu lightboxa, klikać następne już na dużym obrazku, podfruń tam i sprawdź..

Poszukam czegoś  i tu wrzucę wraz z instrukcją okay? Przy ptrettygallery możesz mieć troszkę pod górkę z obsługą..

Generalnie tego typu rozwiązania są bardzo efektowne, to pewne, ale jednocześnie to super funkcjonalność dla stronki, możliwość ciekawej i punktowej prezentacji.. wiesz np. piszesz jakiś artykuł, i przeplatasz go miniaturami fotek, ale kazdy może sobie kliknąć na miniaturę i dostannie w lightboxie dużą fotę..

Ok, przejrż to co sam mam i przyjrzę się tej prettygallery..
Są też gotowe skrypty galerii ale głównie są oparte o php, częsti również i flasha, do tego baza sql.. Jednak większość z nich jest kasztańska i wymaga sporo zabiegów żeby była jakaś urzyteczność..

Pozdrawiam
roco

[pyot]

Masz tempo 
Lightboxa znam co nieco,ściągałem i bawiłem się,całą sztuczka to po prostu powielanie kodu z

Code: [select]

img src

 plus oczywiście zdjęcia.
Kolorki oczywiście w .css.
Jalbum intepluje ten skrypt również.
To co Ci pokazałem jeste po prostu fajne.
Można np kilka grup tematycznych mieć na jednej stronie z podglądem  i komentarzem.
Po prostu fajna sprawa.
Na tym mi zależy.

Ja robię tak:
index.html
images(folder z foto)
ściągam popierdółki,rozpakuję do ogólnego folderu
wklejam podane na stronie skrypty (i tu może być moja pomyłka)
i nic

Dzięki.

[Rico Roco]

Sorry
..hmm doba powinna mieć jak dla mnie 36 godzin.. może znalazłbym chwile, żeby się przespać? hehe

Okay! rozumiem, że jesteś z grubsza "obcykany" w temacie lightboxa, to ułatwi sprawę, ponieważ instalka tego gówienka, choć urodziwego.., jest tak samo dziecinnie prosta jak lightboxa.., no może ciupinke więcej opcji..

Zobacz klasycznego lightboxa + efekt reflection, których użyłem do prezentacji instalacji skryptu forum SMF 2.0 w wersji beta, na testowym smf:

http://poligon.ricoroco.com/fora/smf2/index.php?topic=10.0 ..na dole masz zmieniacz do skórek i zobacz jak to wyglada na ciemniejszym tle.., jak dla mnie super efekt..

No dobra, chciałbyś, więc, zintegrować prettyGallery.., proponuje przyjrzeć się również rozwiazaniu prettyPhoto, ponieważ tu też zadziała jak galeria, o ile dopiszesz słowo do linka..

Ściągnąłem tę paczkę a właściwie 2 paczki z prettyPhoto i prettyGallery, nie wiem czy dobrze to rozumiesz.. prettyGallery to tylko przewijane miniatury, ale żeby wykoczyły w efekcie ..klona lightboxa, to musisz mieć zainstalowane oba skrypty.. i jedna dodatkowa biblioteke jQuery.js

Spróbuje to napisac jakoś z sensem, ale chłopie zadałeś mi roboty..

Po kolei..

W załączniku załączam paczkę galeria.zip a w niej 2 foldery: prettyGallery i prettyPhoto..

hmm to moze skomplikować, zrobię coś innego, to ja połaczę w jedno i dam do załącznika spakowany katalog "galeria" a w nim bedą 2 instrukcje niezalezne do Galerii i Photo, oraz foldery: "css", "images","js".

Jedna uwaga.. to są dwie sprawy! i jak mniemam potrzebujesz obie.. ponieważ sama prettyGallery, to tylko i wyłącznie przewijane miniatury.., a żeby były klikalne i pojawiał się efekt lightboxa, to musi być dointegrowany prettyPhoto.. i tak zrobimy..

Paczkę trzeba rozpakować i jej zawartość czyli te 3 foldery trzeba wysłac na server uważając, żeby klient ftp np. Total Commander nie pozamieniał nam dużej czcionki na małą!

Na serwerze możemy mieć już takie foldery, więc trzeba najpierw sprawdzić, czy nic się nie nadpisze, np. nasze grafiki.
Nic takiego nie powinno mić miejsca, ponieważ wszystko ma swoje własne nazewnictwo, a grafiki tez siedzą we własnych folderach..
Warto jednak wyrobic sobie prawidłowe odruchy..

Natępnie trzeba wyedytować główny plik indexu, czyli w Twoim wypadku: index.html

A następnie w sekcji head umieścić takie zapisy

GeSHi -› Code: [select]

// GeSHi -› [code=html4strict]

        <script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
        <link rel="stylesheet" href="css/prettyGallery.css" type="text/css" media="screen" charset="utf-8" />
        <script src="js/jquery.prettyGallery.js" type="text/javascript" charset="utf-8"></script>
        <link rel="stylesheet" href="css/prettyPhoto.css" type="text/css" media="screen" charset="utf-8" />
        <script src="js/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8"></script>

</head>

 

jest jeszcze kawałek java skryptu który to inicjuje. Pierwotnie myslałem, że powinien się znaleźć również w sekcji head, ten kawałek:

od prettyPhoto:

GeSHi -› Code: [select]

// GeSHi -› [code=html4strict]

<script type="text/javascript" charset="utf-8">
    $(document).ready(function(){
        $("a[rel^='prettyPhoto']").prettyPhoto();
    });
</script>

i od prettyGallery:

GeSHi -› Code: [select]

// GeSHi -› [code=html4strict]

<script type="text/javascript" charset="utf-8">
        $(document).ready(function(){
            $("ul.gallery").prettyGallery();
        });
</script>

Jednak sądzę, iż trzeba dopisac te kawałki js zaraz pd naszym "holderkiem" na mini-fotki, czyli inaczej pod divem

Można wpływać na ustawienia np. zachowania, czy wygladu.., ale o tym potem..

Jeśli hcemy miec tylko przesuwane mini obrazki na małej przestrzeni, czyli mówię o prettyGallery, to w pasujacym nam miejscu dajemy taki zapis:
- tj. ja to dam w diva, ponieważ można diva łatwo obrobić i rzucić go tam gdzie chcemy..

GeSHi -› Code: [select]

// GeSHi -› [code=html4strict]

<div class="klasa naszego holderka na miniatury">
    <ul class="gallery">
        <li><img src="images/thumbnails/t_1.jpg" width="60" height="60" alt="T 1" /></li>
        <li><img src="images/thumbnails/t_2.jpg" width="60" height="60" alt="T 2" /></li>
        <li><img src="images/thumbnails/t_3.jpg" width="60" height="60" alt="T 3" /></li>
        <li><img src="images/thumbnails/t_4.jpg" width="60" height="60" alt="T 4" /></li>
        <li><img src="images/thumbnails/t_5.jpg" width="60" height="60" alt="T 5" /></li>
    </ul>
</div>

I wydaje mi się, ponieważ zabrakło mi czasu na testy, jednak wydaje sie to być logiczne, że teraz powinniśmy dodać nasz kawałek js i odrazu z ustawieniami
Czyli po divie dodajemy ten js:

GeSHi -› Code: [select]

// GeSHi -› [code=javascript]

<script type="text/javascript" charset="utf-8">
        $(document).ready(function(){
            $("ul.gallery").prettyGallery({
                itemsPerPage : 2,
                animationSpeed : 'normal', /* fast/normal/slow */
                navigation : 'top',&#160; /* top/bottom/both */
                of_label: ' of ', /* The content in the page "1 of 2" */
                previous_title_label: 'Previous page', /* The title of the previous link */
                next_title_label: 'Next page', /* The title of the next link */
                previous_label: 'Previous', /* The content of the previous link */
                next_label: 'Next' /* The content of the next link */
            });
        });
</script>

Jeśli jednak chcemy, żeby miniatury były klikalne i pojawiały sie duże foty w efekcie ..klona lightboxa, to w naszym "holderku" na miniaturki musimy dać inny zapis, czyli połączony z prettyPhoto:

GeSHi -› Code: [select]

// GeSHi -› [code=html4strict]

<div class="klasa naszego holderka na miniatury">
    <ul class="gallery">
        <li><a href="images/fullscreen/1.jpg" rel="prettyPhoto[gallery]"><img src="images/thumbnails/t_1.jpg" width="60" height="60" alt="T 1" /></a></li>
        <li><a href="images/fullscreen/2.jpg" rel="prettyPhoto[gallery]"><img src="images/thumbnails/t_2.jpg" width="60" height="60" alt="T 2" /></a></li>
        <li><a href="images/fullscreen/3.jpg" rel="prettyPhoto[gallery]"><img src="images/thumbnails/t_3.jpg" width="60" height="60" alt="T 3" /></a></li>
        <li><a href="images/fullscreen/4.jpg" rel="prettyPhoto[gallery]"><img src="images/thumbnails/t_4.jpg" width="60" height="60" alt="T 4" /></a></li>
        <li><a href="images/fullscreen/5.jpg" rel="prettyPhoto[gallery]"><img src="images/thumbnails/t_5.jpg" width="60" height="60" alt="T 5" /></a></li>
    </ul>
</div>

I teraz wygląda na to, że trzebaby dodać w tym wypadku - oba skrypty inicjujące:
Czyli po kończącym /divie dodajemy js:

GeSHi -› Code: [select]

// GeSHi -› [code=javascript]

<script type="text/javascript" charset="utf-8">
        $(document).ready(function(){
            $("ul.gallery").prettyGallery();
        });
</script>
<script type="text/javascript" charset="utf-8">
    $(document).ready(function(){
        $("a[rel^='prettyPhoto']").prettyPhoto();
    });
</script>

 

Lub z ustawieniami:

GeSHi -› Code: [select]

// GeSHi -› [code=javascript]

<script type="text/javascript" charset="utf-8">
        $(document).ready(function(){
            $("ul.gallery").prettyGallery({
                itemsPerPage : 2,
                animationSpeed : 'normal', /* fast/normal/slow */
                navigation : 'top',&#160; /* top/bottom/both */
                of_label: ' of ', /* The content in the page "1 of 2" */
                previous_title_label: 'Previous page', /* The title of the previous link */
                next_title_label: 'Next page', /* The title of the next link */
                previous_label: 'Previous', /* The content of the previous link */
                next_label: 'Next' /* The content of the next link */
            });
        });
</script>
<script type="text/javascript" charset="utf-8">
    $(document).ready(function(){
        $("a[rel^='prettyOverlay'],a[rel^='prettyPhoto']").prettyPhoto({
            animationSpeed: 'normal', /* fast/slow/normal */
            padding: 40, /* padding for each side of the picture */
            opacity: 0.35, /* Value betwee 0 and 1 */
            showTitle: true, /* true/false */
            allowresize: true /* true/false */
            counter_separator_label: '/' /* The separator for the gallery counter 1 "of" 2 */
        });
    });
</script>

Jednak u nich na stonie, po kończącym /div'ie, ale PRZED: < /body >< /html >

Widziałem taki kawałek:

GeSHi -› Code: [select]

// GeSHi -› [code=javascript]

</div>
       
        <script type="text/javascript" charset="utf-8">
            $("a[rel^='prettyPhoto']").prettyPhoto({showTitle:false});
            $('ul.gallery:first').prettyGallery({itemsPerPage:3,animationSpeed:'slow'});
            $('ul.textGallery').prettyGallery({itemsPerPage:1,navigation:'bottom'});
            $('ul.gallery:eq(1)').prettyGallery({itemsPerPage:5,navigation:'both',animationSpeed:'fast'});
        </script>

    </body>
</html>

Należy powyższe potraktować jedynie jako wskazówkę.., czy wzór i wg niego zrobic własne ustawienie..


INFO o wygladzie linków itp..

Np. przy prettyGalerry wystarczy wpis klasy przy "ul":

Code: [select]

<ul class="gallery">

Natomiast kiedy chcemy efekt lightboxa w pojedyńczej fotce, to dodajemy: rel="prettyPhoto" i link powinien wygladać tak:

GeSHi -› Code: [select]

// GeSHi -› [code=html4strict]

<a href="images/fullscreen/1.jpg" rel="prettyPhoto" title="Description"><img src="/images1.jpg" alt="Picture 1 title" /></a>

Dodanie w linku do dużej foty: title="Opis Fotki" da nam opis fotki pod spodem,
natomiast dodanie do miniatury: alt="Tytuł Foty" da nam tytuł Foty umieszczony ponad samą fotką..

Jeśli chcemy, żeby to było więcej fotek czyli w gallerii, z efektem lightboxa, to do linku, do dużej fory, dajemy taki rel: rel="prettyPhoto[gallery]"
I nasze linki do duzych fotek powinny wyglądać tak:

GeSHi -› Code: [select]

// GeSHi -› [code=html4strict]

<a href="images/fullscreen/1.jpg" rel="prettyPhoto[gallery]" title="Description"><img src="/images1.jpg" alt="Picture 1 title" /></a>

Jeśli chcemy dodać flasha w zapisie lightboxa (to do prettyPhoto), powinniśmi to przykładowo zapisac tak:

GeSHi -› Code: [select]

// GeSHi -› [code=html4strict]

<a href="[url]http://vimeo.com/moogaloop_local.swf?ver=19223[/url]" rel="prettyPhoto;width=500;height=370;flashvars=clip_id=173714">nazwa linka, lub miniatura</a>

Wtedy zobaczymy np. w efekcie lightboxa naszego np. clipa we flashu..

Skomlikowane to nie jest.. wystarczy odrobina uwagi, i rozumienie co się robi.. za to w nagrodę mozemy otrzymać zarąbiste efekty prezentacji foto na naszej stronce..

[pyot]

Rico...
Jestem pod wrażeniem nie treści,chwilowo,lecz Twojego działania i w ogóle poświęcenia !
Twój trud doceniam,dziś ,jutro najdalej do niedzieli przeanalizuję co tu napisałeśi wobec problemó ponownie skrobnę.

Gdybym mógł się odwdzięczyć...,tylko Ty mnie przerastasz w tej materii

Pracuję w Gimpie,jeżeli potrzebna grafika,banner,layout,gif - cokolwiek, pisz.

Mikołaj zresztą nadciąga

Dzięki i pozdrawiam.

[Rico Roco]

Nie przesadzajmy..

Jestem webmasta.. dla mnie to standart, np. pomocy.. celowo sa tu rózne przeszkadzajki, do kolorowania kodu itp.. Chciałbym rozwijac tutoriale, ale nikomu, kto potrzebuje ..i mnie znajdzie hehe, - nie odmawiam pomocy..

Pyot, przeczytaj wsio uważnie, ja nie miałem czasu na testowanie, lecz jest to naprawde logiczne i nie musze testować, żeby wiedzieć, że można to zintegorwać..
Owszem jest troszkę więcej do zrobienia niż przy normalnym lightboxie.., ale sam wiesz.. hehe "bez pracy nie ma kołaczy".. inaczej.. jak chcesz okazałej prezentacji swojego contentu na stronie, to muszisz się trochę postarać..
Podałem Ci dokładną instrukcję + tipsy jak to zastosować/zintegrować.. na statycznej stronce, ale nie tylko, ponieważ mozna tego ..dingsa zintegrować dosłownie ze wszystkim..

Przeczytaj uważnie i sam zobaczysz, że to nic trudnego, oczywiście jakby były problemy to pisz, postaram się pomóc.
jak widzisz namawiam Cię do samodzielnej instalki, poniewaz wiem, że się uczysz html'a i na stówkę przyda Ci się to..

Tak!, dokonałem w tej jednej skórce (Azure) sporych modyfikacji, w tym optymalizacji.. Niestety forum jest zapuszczone i wymaga gruntownego przegladu..
Większość rzeczy mam już porobione, i testuję w wolnej chwili, na lokalnym serverku.. (na VertrigoServ jakby co..), jak będzie gotowe, to wymienię 96% plików na tym forum.. I dopiero wtedy postaram się znaleźć czas na rozwijanie myśli webmasterskiej i nie tylko.., mam nadzieje, że @Yurek3 również znajdzie czas i pociągnie tę nienadzorowaną.. wszak jest mistrzuniem w tych kwestiach..

A na razie jest jak jest.., jak mi się nie uda z totalną zmianą do końca roku, to przynajmniej połatam to co mogę i zoptymalizuję bo jednak chodzi trochę za wolno..

Muszę się lyczyc z tym, że ludzie dalej niestety urzywają IE, czy starego FF, a dopiero od wersji 3.1 w FireFoxie, miejmy nadzieję.. będzie to o co chodzi.., np. obsługiwany efekt Text-Shadow.. Możesz to zobaczyć na tej skórce, ale tylko pod Operą.. Na razie to dorobiłem funkcjonalność, którą widać pod edytorem kiedy piszesz posta.. tj. formularz do wysyłania foty direct do ImageShack.us..

Ty masz podobnie.. z tą integrą.. o ile zależy Ci na tym, żeby mogli Cię odwiedzac wszyscy.. Muszisz sprawdzać jak co się wyświetla pod każdą przegladarką, a przynajmniej pod tymi trzema..
To forum niestety najokazalekj prezentuje się pod ostatnią Operą.., dlatego mam tu zabawki, które hmm na otarcie łezki.. mam np. dla IE, czyli efekty przejścia itd..

Na Twoim miejscu sprawdziłbym jeszcze takie miejsca:

http://stickmanlabs.com/lightwindow/

http://userfriendlythinking.com/Blog/BlogDetail.asp?p1=7013&p2=101&p7=3001

http://userfriendlythinking.com/_CustomFiles/flickrGallery/Example-3a-Small-Auto.html

To tylko przykłady.., ale mam już ponad 10 tys. zakładek i ciężko mi coś znaleźć mimo porządku, który tam trzymam..
Mam jednak nadzieję, że te linki wpuszczą trochę światła w Twoje poczynania..

Pozdrawiam
roco

[pyot]

Ok.
Gdybyś mi nie pomógł - poległbym z kretesem.
Dla mnie js jest nieznane.
Mam jeszcze problem z kilkoma rzeczami...
Otóż nie wiem gdzie ustalić odstępy pomiędzy miniaturami bo u mnie są zbyt duże...,i to sporo.
Szukam,kombinuję i nic,a w plikach .css tego nie widzę.
Poza tym nie wiem znowu jak zlikwidować paskudny  border na tychże miniaturkach (odnośniki),to jest gdzieś schowane w linkach ?

Niedawno skończyłem i coś wyszło
Oczywiście próby.

A te co pokazałeś to rzeczywiście bajer,jak będę miał czas to pokombinuję.

Pozdrawiam

[Rico Roco]

To co Ci pokazałem, to jedna z multum możliwości.. takich prezentacji..
Ale zaciekawiłbyś się pierwszym linkiem, gdzie gościu prezentuje niemal wszystko w efekcie lightboxa, wiesz całe stronki, różne multimedia itp.. Znajdziesz chwilę to pokombinuj z tamtą galerią też.. To Cię tylko rozwinie hehe

Te miniaturki występują jako już elemeny listy czyli ul -> li (items czyli poszczególne miniaturki..)

W pliku jquery.prettyPhoto.js masz różne opcje ustawień np.:

GeSHi -› Code: [select]

// GeSHi -› [code=javascript]

jQuery.fn.prettyGallery = function(settings) {
    settings = jQuery.extend({
        itemsPerPage : 2,
        animationSpeed : 'normal', /* fast/normal/slow */
        navigation : 'top',  /* top/bottom/both */
        of_label: ' of ', /* The content in the page "1 of 2" */
        previous_title_label: 'Previous page', /* The title of the previous link */
        next_title_label: 'Next page', /* The title of the next link */
        previous_label: 'Previous', /* The content of the previous link */
        next_label: 'Next' /* The content of the next link */
    }, settings);
    return this.each(function(){
        // Global variables needed in multiple functions.   
        var currentPage = 1;
        var itemWidth = 0;
        var itemHeight = 0;
        var galleryWidth = 0;
        var pageCount = 0;
        var animated = false;
        var $gallery = $(this);

item = Twoja miniatura.. i możnaby coś ponarzucać.. ale zabawiaj się tym potem..

Zajrzyjmy do styli od prettyGallery..

Mamy określenie diva i ul od galerii ale poniżej mamy określenie wygladu nawigacji czyli - ul.prettyNavigation:

GeSHi -› Code: [select]

// GeSHi -› [code=css]

    ul.prettyNavigation {
        float: left; clear: left;
        list-style: none;
        margin: 0;
        border: 1px #bdc2c4 solid;
    }

Jak widać nawigacja ma border ustawiony na 1px, jeśli to też bedzie Ci przeszkadzac, to ustaw na: 0 (tylko liczbę..)

Powyżej mamy taki zapis:

GeSHi -› Code: [select]

// GeSHi -› [code=css]

    div.prettyGallery ul.prettyGallery {
        list-style: none;
        float: left;
        margin: 5px 0 2px 0;
    }
   
        div.prettyGallery ul.prettyGallery li { display: block; float: left; margin-right: 5px; }

Przypuszczam, że to tu możesz zmniejszyć ten odstęp za pomocą margin-right, ale powyzej masz margin: |5px| <-to góra |0| <-to prawy |2px| <- to dół, a |0| <- to margin z lewej strony i jak widać całe "pudełko" ma po obu bokach 0px
 

Trzeba się zainteresowac tym wpisem:

GeSHi -› Code: [select]

// GeSHi -› [code=css]

div.prettyGallery ul.prettyGallery li { display: block; float: left; margin-right: 5px; }

Proponuję zmniejszyć ten margin-right: na 2px; i sprawdzić..

Zamień ten wpis, tj znajdź ten powyższy kawałek kodu w stylach od prettyGallery ul.prettyGallery li {....

i zamień na to:

GeSHi -› Code: [select]

// GeSHi -› [code=css]

ul.gallery li {
            display: block;
            float: left;
            margin: 0 2px 0 0;
        }

            ul.gallery li a {
                padding: 0px;
                display: block;
                border: 0px #9db2b9 solid;
                line-height: 0;
            }

Jak sądzę, połączyłeś te skrypty, żeby mieć nie tylko przesuwane miniaturki, ale również klikalny efekt lightboxa.., tak wiec miniaturki są od razu linkami i to dlatego ten zapis z "a" na końcu klasy. Jakby się zrobiło za ciasno to zamień ten padding z 0px na np. 2px.

Przećwicz to i daj znać. Może jakby nie pomogło to zrób screena i tu wrzuć..

Mogło być tak, że był określony tylko prawy margines odstępu, a przegladarki interpretowały resztę jak było im wygodnie.. Wrzuć te wpisy do styli od prettyGallery i zobacz efekty, i oczywiście pisz co się dzieje..

Pozdrawiam
roco

[pyot]

Pobawię się wieczorem a jutro Ci odpiszę,ważne,że coś sie ruszyło dzięki Tobie...
Jakoś na JS nie mam czasu się uczyć a html/css znam w stopniu pozwalającym mi rozumieć co i jak
Poza tym teraz połknąłem ciut bakcyla fotografii i latam w weekendy po mieście z nową puszką i cykam pstryki.

Galeria jaką mi pokazałeś robi wrażenie -
http://userfriendlythinking.com/_CustomFiles/flickrGallery/Example-3a-Small-Auto.html
edit:21:19:00
Już ją mam !
Prosta,nie wiem tylko czy można ją wykorzystywać nawet do celów komercyjnych
Ściągnąłem sobie wczoraj,z grubsza przetrzepałem pliki i oczywiście nie mogę na razie znaleźć gdzie siedzi odnośnik do flickr'a,w nawigacji po najechaniu myszką pojawia się w lewym górnym rogu,jak dla mnie jest zbyteczny.
I,tu wstydem się oblewam,gdzie u licha są odnośniki do zdjęć !
Bo jak na razie (pobieżnie) w treści dokumentu są odnośniki do class w style.css&nbsp; a tam nic nie mogę/umiem znaleźć...\
Ale to jeszcze pogrzebię i zobaczymy,jak piszesz:to są kroki do poznawania i nauki

Dzięki&nbsp; @roco,Wrocłąw pluchą stoi co nie znaczy,że pozdrowienia nie mogą być&nbsp; słoneczne&nbsp;


Edit:
To sobie polukałęm.
Oto zrzut -


Po kliknięciu w pasku nawigacji,czyli jak pokazałeś

Code: [select]

&nbsp; ul.prettyNavigation {
&nbsp; &nbsp; float: left; clear: left;
&nbsp; &nbsp; list-style: none;
&nbsp; &nbsp; margin: 0;
&nbsp; &nbsp; border: 1px #bdc2c4 solid;

Ten border akurat mi nie przeszkadza,powinien tam być,ale po kliknięciu w tą klasę pozostaje brzydki pasek jaki widać na zrzucie,strzałka nr1.
Problem numer 2 to border o którym pisałem...
teraz myślę,że to może być po prostu link...,bo jakoś nie widzę w ogóle przypisane odnośnikom jakiekolwiek cechy,nawet kolory są oryginalne ,mylę się ?
Jeżeli nie,to wystarczy zrobić

Code: [select]

a.link

 bez border ?
Trzecia strzała pokazuje właśnie te paskudne,za duże zdecydowanie odstępy...

Oto html :

Code: [select]

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-2">
<meta name="Author" content="#">
<title>Galeria#2</title>
<style type="text/css">
body
{
background-color:#000000;

}
.gal
{
margin:20 auto;text-align:center;
display:block;
width:300px;
}
</style>
&nbsp; &nbsp; <script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
&nbsp; &nbsp; <link rel="stylesheet" href="css/prettyGallery.css" type="text/css" media="screen" charset="utf-8" />
&nbsp; &nbsp; <script src="js/jquery.prettyGallery.js" type="text/javascript" charset="utf-8"></script>
&nbsp; &nbsp; <link rel="stylesheet" href="css/prettyPhoto.css" type="text/css" media="screen" charset="utf-8" />
&nbsp; &nbsp; <script src="js/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8"></script>
&nbsp; &nbsp;
</head>
<body>

<div class="gal">
&nbsp; <ul class="gallery">
&nbsp; &nbsp; <li><a href="obrazy/1.jpg" rel="prettyPhoto[gallery]"><img src="thumbs/1.jpg" width="120" height="80" alt="T 1" /></a></li>
&nbsp; &nbsp; <li><a href="obrazy/2.jpg" rel="prettyPhoto[gallery]"><img src="thumbs/2.jpg" width="120" height="80" alt="T 2" /></a></li>
&nbsp; &nbsp; <li><a href="obrazy/3.jpg" rel="prettyPhoto[gallery]"><img src="thumbs/3.jpg" width="120" height="80" alt="T 3" /></a></li>
&nbsp; &nbsp; <li><a href="obrazy/4.jpg" rel="prettyPhoto[gallery]"><img src="thumbs/4.jpg" width="120" height="80" alt="T 4" /></a></li>
&nbsp; &nbsp; <li><a href="obrazy/5.jpg" rel="prettyPhoto[gallery]"><img src="thumbs/5.jpg" width="120" height="80" alt="Dzieki raz jeszcze...
teraz troche inaczj pokazne motyle... " /></a></li>
&nbsp; &nbsp; <li><a href="obrazy/6.jpg" rel="prettyPhoto[gallery]"><img src="thumbs/6.jpg" width="120" height="80" alt="T 4" /></a></li>
&nbsp; </ul>
</div>
 <script type="text/javascript" charset="utf-8">
&nbsp; &nbsp; $(document).ready(function(){
&nbsp; &nbsp; &nbsp; $("ul.gallery").prettyGallery();
&nbsp; &nbsp; });
</script>
<script type="text/javascript" charset="utf-8">
&nbsp; $(document).ready(function(){
&nbsp; &nbsp; $("a[rel^='prettyPhoto']").prettyPhoto();
&nbsp; });
</script>


</body>
</html>

Css znasz

[Rico Roco]

okay, co tu mamy..

Po pierwsze nie może być taki zapis:

GeSHi -› Code: [select]

// GeSHi -› [code=css]

.gal
{
margin:20 auto;text-align:center;
display:block;
width:300px;
}

Jak juz to proponuje taki zapis:

GeSHi -› Code: [select]

// GeSHi -› [code=css]

.gal
{
margin:20px auto;
text-align:center;
display:block;
width:300px;
}

Musisz podać czy to jednostki px czy inne..

Tak masz rację i widać to na obrazkach, to z powodu linków..

Proponuje dopisać do styli taki zapis:

GeSHi -› Code: [select]

// GeSHi -› [code=css]

a:link, a, a link, a img, a li, img {
border: 0;
outline: none;
text-decoration:none;
}

Powinieneś w ten sposób pozbyć się obwódek, ramek i innych zdziwień widzianych tylko pod IE i czasami pod FF..

Po za tym proponuje, skoro skrypty są w XHTML'u, to trzymać tę formę i dac na początku html'a (Twojej stronki) to:

GeSHi -› Code: [select]

// GeSHi -› [code=html4strict]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[url]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd[/url]">
<html xmlns="[url]http://www.w3.org/1999/xhtml[/url]" xml:lang="pl" lang="pl">
    <head>
        <meta http-equiv="Content-Type" content="application/xhtml + xml; charset=ISO-8859-2" />
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-2" />
        <meta name="Robots" content="follow,all" />
        <meta name="Revisit-After" content="2 days" />
        <meta name="Distribution" content="global" />
        <meta name="Author" content="Pyot" />
        <meta name="Copyright" content="pyot.pl" />
        <meta http-equiv="Content-Language" content="Polish" />
        <title>Galeria Pyota</title>

Tylko nie rozumiem po co charset w iso? będziesz zamieszczał tam dodatkowo trści tekstowe w PL? Możesz to robić również w UTF-8, a skrypty będą lepiej "chodzić".. taki tips.. ale ten cały nagłówek to wymień na ten ode mnie.. wiesz coby obciachu nie było.. bo niestety do takiej galeryjki taaaki html4 to trochę jak mocherowy beret ..latem..

Ja wiem, że się dopiero uczysz, ale to też nauka..

Myślę, że powinno być lepiej, ten margin mógł poknocić..

Jak nie do końca pomoże, to daj znać, podłubiemy z paddingiem i marginesami samych items..

Co do tej nowej galerii to musiałbym ściągnąć żeby wiedzieć o czym mówisz..Ale trzeba przejrzeć pliki, bo na stówkę jest info co i jak, lub gdzie co siedzi.. Może skrypt pobiera z konkretnej lokalizacji i np. korzysta do tego z pliku .xml? Musialbym znaleźć chwilę żeby się temy przyjrzeć.., to chyba zrozumiałe, że nie znam wszystkich skryptów na świecie hehe nikt nie zna.. jakby znał to explodowałby mu łeb haha

Ok popraw i daj znać, jak będzie chwila to ściągnę kolejne gówienko/zabawkę i się przyjrzę, okay?

Pozdrówka
roco

[pyot]

Nie chcę już Ci przeszkadzać.
Nie mogę znaleźć tylko jak zrobić aby zmniejszyć odległość pomiędzy foto,ta pokazana na zrzucie ma z 5 metrów !
A w pliku .css jakoś tego nie widzę.
Tą drugą galerie już mam obcykaną
Roco,czy mogę ją używać oczywiście nie usuwając nic ze skryptów na temat twórcy kodu ?

Dzięki.

[Rico Roco]

Ależ ..wcale mi nie przeszkadzasz.. nikt mi nie przeszkadza, nie mam wiele czasu, poniewaz jestem zapracowany, ale nikt mi nie przeszkadza ok? Możesz pytać o co chcesz, jak będzie w zasięgu mojej wiedzy to zawsze pomogę, spox?


Tak, możesz tej używać jak chcesz, ponieważ jest napisana na Otwartym Kodzie! Ważne, żebyś z kodu nie usuwał info o twórcach.., bo to jest z lekka fuckup..

Wracając do tematu..

Czy zastosowałeś to, co Ci napisałem?
Miałeś w samej stronce, w sekcji head, kawałek styli, czy to poprawiłeś wg. mojego tipsa?

Nie utworzyłem tej galerii do testów, kiedyś tam.. ale nawet nie wiem gdzie to mam.. za dużo wszystkiego hehe
Musisz byc bardzie communicado, okay? potrzeba mi dokładniejszych info.. np. czy ten efekt "długiej przerwy" obserwujesz tylko pod IE? a jeśli to czy nie jest to aby wersja 6? To ważne info, ważne żebyś odwiedził swoją galerię różnymi przeglądarkami, IE7, FF (w ostatniej wersji) i Opera (w ostatniej wersji).. chyba, że brak Ci mozliwości.. Potrzeba, żebys zaobserwował ten "efekt" i ew. różnice, mogłoby to znacznie pomóc..

Jak rozumiem, są "mega-rozstępy" pomiędzy poszczególnymi miniaturami, czy tak? Tutaj nawet nie wiem czy napewno nie ma błędów.. może nie zamknąłeś jakiegoś taga.. wsio mozliwe..

Ale ok, załóżny; że zastosowałeś to, co podałem Ci w poprzednim poście czyli w samym pliku html tam gdzie style i klasa gal (.gal {})


..że w stylach zastosowałeś to:

GeSHi -› Code: [select]

// GeSHi -› [code=css]

ul.gallery li {
      display: block;
      float: left;
      margin: 0 2px 0 0;
    }

      ul.gallery li a {
        padding: 0px;
        display: block;
        border: 0px #9db2b9 solid;
        line-height: 0;
      }

To jeśli to zobacz sam, jest tu niemal wszystko wyzerowane.. nie ma wręcz gdzie palce wsadzić.. no może zapałkę grubości 2px..

Może zapiszmy to tak:

GeSHi -› Code: [select]

// GeSHi -› [code=css]

div.prettyGallery {
    display: inline-block;
    padding: 0;
}

div.prettyGallery, ul.prettyGallery {
    list-style: none;
    float: left;
    margin: 2px 0 2px 0;
    overflow: hidden;
    padding: 0;
}

ul.gallery {
    list-style: none;
    margin: 0 0 2px 0;
    padding: 0;
}

ul.gallery li {
    display: block;
    float: left;
    margin: 0 2px 0 0;
    left: 0;
}

ul.gallery li a {
    padding: 0;
    display: block;
    border: 0 solid;
    line-height: 0;
    right: 0;
}

tj. znajdź podobne wisy i je wyłącz/albo zamień na te co podałem powyżej

Poza tym w pliku html, gdzie stosujesz klasę .gal to ją wyłącz, tj. jej nie dopisuj do holderka
- i zamiast tego zastosuj klasę: "gallery prettyGallery" ..zapewniam Cię, że można łączyć w ten sposób klasy..

Czyli powinieneś zamiast:

GeSHi -› Code: [select]

// GeSHi -› [code=html4strict]

<div class="gal">
    <ul class="gallery">

to daj najpierw:

GeSHi -› Code: [select]

// GeSHi -› [code=html4strict]

<div class="gal">
    <ul class="gallery prettyGallery">

Ale spróbuj również albo może od tego powinieneś zacząć, bo Twoje wartości mozesz dodać później do klasy div.prettyGallery {}

Wiec spróbuj to zapisac tak:

GeSHi -› Code: [select]

// GeSHi -› [code=html4strict]

<div class="prettyGallery">
    <ul class="gallery">

Oczywiście ten zapis dotyczy już samego pliku html, tuż przed samą galerią.., natomiast te style, które teraz podałem muszą pójść do pliku prettyGallery.css

Czyli edytujesz ten plik, znadujesz na początku to:

GeSHi -› Code: [select]

// GeSHi -› [code=css]

    div.prettyGallery { display: inline-block; }

    div.prettyGallery ul.prettyGallery {
        list-style: none;
        float: left;
        margin: 5px 0 2px 0;
    }
   
        div.prettyGallery ul.prettyGallery li { display: block; float: left; margin-right: 5px; }

        ul.gallery li {
            display: block;
            float: left;
            margin: 0 2px 0 0;
        }

            ul.gallery li a {
                padding: 0px;
                display: block;
                border: 0px #9db2b9 solid;
                line-height: 0;
            }
       

I zamieniasz na mój wpis, który jest powyżej.., okay? to jest jasne? powinno..

Pozdrawiam i wierzę, że sobie poradzisz.. to proste, wystarczy odrobinka uwagi..
roco

[Rico Roco]

Już nie edytuje bo się co rozsypie..

Przypuszczam, że tak się stało ponieważ dałeś swoją klase która nie miała odwzorowania w pliku prettyGallery.css, wiesz Twoja klasa .gal {}

Może po prostu podmień nazwy tych klas w samym pliku html zanim dopiszesz coś do samych styli zewnętrznych, czyli daj ten zapis:

GeSHi -› Code: [select]

// GeSHi -› [code=html4strict]

<div class="prettyGallery">
  <ul class="gallery">

Moze się okazać, że wsio w pariadku..
r.

[pyot]

Roco,może zdążę wieczorem sprawdzić co radzisz.
Zobacz ten problem live.

[Rico Roco]

sorka nie stało czasu..

No zobaczyłem.. trzeba było tak odrazu..

Wystarczyło zastosowac tipsa z mojego poprzedniego posta czyli zamiast:

GeSHi -› Code: [select]

// GeSHi -› [code=html4strict]

<div class="gal">
    <ul class="gallery">

to wpisać to:

GeSHi -› Code: [select]

// GeSHi -› [code=html4strict]

<div class="prettyGallery">
    <ul class="gallery">

Tylko, że style od tej galeri mają drobne błędy inaczej po ich naprawieniu, całość jest nieposłuszna i leci całkiem na lewą stronę..
Ty natomiast kolego jesteś nie uważny.. Skopiowałes tego heda tu ode mnie a tam niestety linki zostały zamknięte w klamerki od [bbcode]
Tak nie może być! Sorry, mówiłem Ci otym, to forum próbuję dostosowac do prezentacji kodu itp.. stąd podświetlanie składni i multum innych zabawek.. ale niestety coś za dokładnie to wychodzi.. tj skrypt forum się chroni i jak widzi "gołe linki" to zamienia je na bbcode..
Musisz kopiując kod, tam gdzie są linki uważać na [ klamerki ] i bedzie git, okay?

Jedyny problem jaki zauważyłem to przy nawigacji te strzałeczki, tj ta z lewej nie jest do końca no i w ogóle widzę tam asymerie.. jak sądzę sam autor chyba nie do końca to przemyślał, lub nie wiedział jak z tego wyjść..

pobawiłem się tym i to trochę przesunąłem, ale usunąłem też ramke i wygląda zdecydowanie lepiej, szczególnie kiedy dochodzisz do końca i nie ma tej połówki kolejnej miniatury.., wtedy juz wygladało całkiem asymertycznie..

Zrobiłem kilka fotek z tej zabawy:






to już po ustawieniu:






Tu ustawiłem border na 0:






Połączyłem skrypty w jeden i dołozyłem ustawień, to nic, że skrypty maja swoje, można edytujac tylko plik index.php, czyli Twoja galerię - wpływać na zachowanie i samej galerii i na efekt lightboxa.. Jest opisane więc pobaw się w ustawienia i zobacz co Ci pasi

GeSHi -› Code: [select]

// GeSHi -› [code=javascript]

<script type="text/javascript" charset="utf-8">
//<![CDATA[
$(document).ready(function(){
$(&#39;ul.gallery&#39;).prettyGallery({
    itemsPerPage:3,/* ile ma być widocznych miniatur + połowa kolejnej */
    animationSpeed:&#39;slow&#39;,/* fast/normal/slow/- szybkość animacji: | szybko | notmalnie | powoli | */
    navigation:&#39;both&#39;,/* top/bottom/both/ - gdzie nawigacja: | góra | dół | tu i tu | */
    });
$("a[rel^=&#39;prettyPhoto&#39;]").prettyPhoto({
    animationSpeed: &#39;slow&#39;,/* fast/slow/normal/ - szybkość animacji: | szybko | powoli | normalnie | */
    });
});
//]]>
</script>

wiadomo..: ilość fotek w tym przewijanym okienku, szybkość przesuwania i nawigacja, w tym wypadku dałem na górze i na dole i wyszedł ciekawy efekt.. (fotka w załączniku..)
No i jest od prettyPhoto ustawienie: szybkości animacji, jest na slow, ale ciekawie wygląda kiedy jest na fast. Znowu przy samej prettyGallery może być przydatne kiedy jest duzo fote ustawienie na fast.., hmm kto nie sptóbuje, ten nie wie, nie? hehe


To jest Twój plik index.html:

GeSHi -› Code: [select]

// GeSHi -› [code=html4strict]

<!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" xml:lang="pl" lang="pl">
    <head>
        <meta http-equiv="Content-Type" content="application/xhtml + xml; charset=ISO-8859-2" />
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-2" />
        <meta name="Robots" content="follow,all" />
        <meta name="Revisit-After" content="2 days" />
        <meta name="Distribution" content="global" />
        <meta name="Author" content="qrcze" />
        <meta name="Copyright" content="qrcze.pl" />
        <meta http-equiv="Content-Language" content="Polish" />
        <title>:) hmm stronka powinna mieć jak&#177;&#182; nazwę nie?</title>
<style type="text/css">
/*<![CDATA[*/
body
{
background-color:#000000;
margin:0 auto;
padding:0;
}
.gal
{
margin:20px auto;
text-align:center;
width:auto;
}
a:link, a, a link, a img, a li, img {
border: 0;
outline: none;
text-decoration: none;
}
/*]]>*/
</style>
<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" href="css/prettyGallery.css" type="text/css" media="screen" charset="utf-8" />
<script src="js/jquery.prettyGallery.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" href="css/prettyPhoto.css" type="text/css" media="screen" charset="utf-8" />
<script src="js/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body>
    <div align="center" style="margin:2em auto; text-align:center;" class="gal">
    <div align="center" class="prettyGallery">
        <ul class="gallery">
            <li><a href="obrazy/1.jpg" rel="prettyPhoto[gallery]" title="Opis foty nr. 1"><img src="thumbs/1.jpg" width="120" height="80" alt="Tytuł foty nr. 1" /></a></li>
            <li><a href="obrazy/2.jpg" rel="prettyPhoto[gallery]" title="Opis foty nr. 2"><img src="thumbs/2.jpg" width="120" height="80" alt="Tytuł foty nr. 2" /></a></li>
            <li><a href="obrazy/3.jpg" rel="prettyPhoto[gallery]" title="Opis foty nr. 3"><img src="thumbs/3.jpg" width="120" height="80" alt="Tytuł foty nr. 3" /></a></li>
            <li><a href="obrazy/4.jpg" rel="prettyPhoto[gallery]" title="Opis foty nr. 4"><img src="thumbs/4.jpg" width="120" height="80" alt="Tytuł foty nr. 4" /></a></li>
            <li><a href="obrazy/5.jpg" rel="prettyPhoto[gallery]" title="Opis foty nr. 5"><img src="thumbs/5.jpg" width="120" height="80" alt="Dzieki raz jeszcze... Tytuł foty nr. 5" /></a></li>
            <li><a href="obrazy/6.jpg" rel="prettyPhoto[gallery]" title="Opis foty nr. 6"><img src="thumbs/6.jpg" width="120" height="80" alt="Tytuł foty nr. 6" /></a></li>
        </ul>
    </div>
<script type="text/javascript" charset="utf-8">
//<![CDATA[
$(document).ready(function(){
$(&#39;ul.gallery&#39;).prettyGallery({
    itemsPerPage:3,/* ile ma być widocznych miniatur + połowa kolejnej */
    animationSpeed:&#39;slow&#39;,/* fast/normal/slow/- szybkość animacji: | szybko | notmalnie | powoli | */
    navigation:&#39;both&#39;,/* top/bottom/both/ - gdzie nawigacja: | góra | dół | tu i tu | */
    });
$("a[rel^=&#39;prettyPhoto&#39;]").prettyPhoto({
    animationSpeed: &#39;slow&#39;,/* fast/slow/normal/ - szybkość animacji: | szybko | powoli | normalnie | */
    });
});
//]]>
</script>
    </div>
    </body>
</html>

Jak widać, dałem tego holderka z galerią w dodatkowego diva i dzięki temu można za pomocą klasy .gal {} łatwo wpływac na miejsce wyświetlania itp.. Narazie jest ustawione po środku i 20px od góry..

Musisz podmienić style.. Spakowałem do zipa plik index.html i style prettyGallery.css

Dobra podmień pliki i coś rzeknij, okay? wg. mnie to powinieneś przedewszystkim zastosować moje tipsy.., to byłaby jakas nauka, albo pójść na skróty i tylko podmienić pliki hehe

Na zdrowie Pyot 

Pozdrówka
roco

[pyot]

Trochę mi wstyd za te bezmyślne wklejenie kodu baz sprawdzenia - wybacz.
Od kilku dni mam dużo pracy,od rana do wieczora.
Niemniej do Ciebie zaglądam.Galerię załadowałem dopiero wczoraj.
A Twoje wczorajsze rozwiązanie,jak się okazuje dobre miałem sprawdzić dzisiaj ale Ty jesteś szybszy.Za szybki
No i Roco,nie szukam żadnych skrótów,naprawdę.
Doceniam Twoją pracę za którą dziękuję,Twoje rozwiązanie działa

Wkrótce się odezwę,ponownie wielkie dzięki i do następnego  klikania ?

Pozdrawiam.

[Rico Roco]

hehe no i, Pyot? co ja mam Ci napisać?
Wydaje mi się, że za bardzo się "ceregielisz".. a przecież mnie znasz i to już parę latek.. wiesz że pisze głównie grotezką, ale od zawsze nazywam rzeczy po imieniu.. białe jest bałe.. a komuch, zawsze nim będzie hehe bez względu jakbyśmy go nie nazywali.. itd..
Zobacz mi zależy na jak najwyższej jakości tego co robię, i Ty powieneś to rozumieć.., zobacz masz swoją remontownię.. i co odwalasz ludziom "sztukę", czy starasz się robic to co robisz jak najlepiej? ze mną jest tak samo.. nic się nie zmieniło odkąd jestem na tym świecie, mam swoje zasady i jestem ich niewolnikem..
Nie musi Ci byc wstyd, nie masz najmniejszego powodu, żeby przepraszać mnie za cokolwiek.. a i tak brzmiało to tak, jakbyś przepraszał świat, za to że żyjesz.. hmm to chyba niezbyt rozsądne.. I z niczym nie pękaj.. info o takiej galerii i jej instalce czy integrze.. przyda się tu.. to raczej ja powiniem ubolewac nad tym, że do tego stopnia odzwyczaiłem się od polskiej mowy, że piszę z takimi błędami, jakbym wcale do szkoły nie chodził hehe
Moje rozwiązanie napewno działa, ponieważ zapamiętałem Twoją stronę i ją poprawiłem.. i nie ma tu żadnej Twojej winy, poprostu nie było tak easy nie?, ale jak widac na fotkach - jest to możliwe.. Podmień pliki i będzie wypasio! Przecież chciałeś mieć wypaśną galerię i ją masz, więc głowa do góry hehe

Pozdrawiam
roco

PS. Zapraszam z kolejną zgadką/zagwozdką!

[pyot]

Nie noroco,nie jest tak kiepsko ze mną 

Po prostu nie lubię nadużywać czyjegoś czasu,ja amatorsko dla znajomych coś tam robię i wiem ile to zajmuje,Ty webmasta to pewnie szybciej,ale jednak.
A tu ten chce to,tamten owamto jeszcze inny prosi o to i owo i tak leci,na wypełnieniu zobowiązań schodzi masa czasu.
A Twój czas ?
Tylko o tym pisałem.

Ja mam kiepską pamięć,i mam z tym problem ale to moja historia,i nie wiem ile bym sobie do głowy wbijał to większość przeleci nie zostawiając wiele pożytecznego

Więc to co mi wytłumaczysz a ja potaknę - niewykluczone,że pojutrze wstyd mi będzie ponownie zadać to samo pytanie...

Tyle.
A z zagwózdką masz jak w banku.

Pozdrawiam.

[Rico Roco]

..loco spoco

Tylko powiedz mi.., poprawisz to kiedyś? bo zajrzałem tam i jest jak było.., a wystaczy 2 pliki podmienić..
Tak kosztuje to włożona pracę, jak wszystko zresztą, ale ja się przy tym rozwijam więc również mam korzyść, okay?

Co do zapamiętywania to straszne co piszesz.. Może to zapisuj?, np. utwórz katalog tipsy a w nim inne np. html, css, javascript, i jak coś trafisz to to zapamiętuj w odpowiednich folderach.. całe stronki, wpisy w notatniku itp.. napewno się przyda, i wyrobisz sobie prawidłowe odruchy.. wystarczy później, że zostanisz ich niewolnikiem hehe

Zrób piękną galeryjkę, ok?

Pozdrówka
roco

[pyot]

..loco spoco

Tylko powiedz mi.., poprawisz to kiedyś? bo zajrzałem tam i jest jak było.., a wystaczy 2 pliki podmienić..
Tak kosztuje to włożona pracę, jak wszystko zresztą, ale ja się przy tym rozwijam więc również mam korzyść, okay?

Co do zapamiętywania to straszne co piszesz.. Może to zapisuj?, np. utwórz katalog tipsy a w nim inne np. html, css, javascript, i jak coś trafisz to to zapamiętuj w odpowiednich folderach.. całe stronki, wpisy w notatniku itp.. napewno się przyda, i wyrobisz sobie prawidłowe odruchy.. wystarczy później, że zostanisz ich niewolnikiem hehe

Zrób piękną galeryjkę, ok?

Pozdrówka
roco

Roco.
Tą galerię wrzuciłem aby Ci pokazać na żywo
Galeryjka dla znajomej (wspominam,że pomógł mi ktoś życzliwy).
Tylko jeszcze ważny dzynks...
Jak mam wstawić kodowanie aby teksty jako komentarz akceptowały ppolskie znaki ?
Zmieniam gdzie mogę ;
Tu chodzi o

Code: [select]

charset="utf-8"

 prawda ?
No,ale zmieniam gdzie się da na

Code: [select]

charset="iso-8859-2"

I chyba mnie...!@#$%^&*()
Pozdrawiam

[Rico Roco]

To spoko, bo już się martwiłem..

Masz problem z kodowaniem?
A w jakim kodowaniu jest stronka Twojej przyjaciółki? - to w takim kodowaniu musisz pisać..
Zrobiłem test i na tej Twojej galeryjce i masz w meta ISO-8859-2, a skrypty narzucają sobie swoje własne kodowanie utf-8, niezależne od kodowania strony.

Taki przykład.. jeśli napiszesz w html w kodowaniu iso-8859-2 te literki: ĄŻŹĆĘŚŃŁÓ ąśżźćęółń, to będą w kodzie wyglądały tak:

Code: [select]

ˇŻ¬ĆĘ¦ŃŁÓ ±¶żĽćęółń

Jeśli miałyby być kodowane w utf-8 te same literki, czyli: ĄŻŹĆĘŚŃŁÓ ąśżźćęółń, to będą w kodzie wyglądały tak:

Code: [select]

ĄŻŹĆĘŚŃŁÓ ąśżźćęółń

Oczywiście w UTF-8 bez (BOM)

Jesli stronka ma kodowanie w iso, to musisz stosowac to kodowanie w znakach, tak jak to pokazałem w "code" przy kodowaniu iso..

Napisz więcej, to proste, ale potrzeba więcej szczegółów.., o ile to co napisałem nie pomogło..

Pozdrówka
roco

[pyot]

Link.
Chwilowo komponuję i testuję...
Podpowiedz.

[Rico Roco]

Ok.. sam się prosisz hehe

no dobra, stronka ma sporo błedów, głównie to mieszanka starego html'a z nowym, czyli nie pozamykane tagi itp. dupershwanze.. loozio, nie pekaj, daj te pliki, to Ci poprawię, żeby przechodziło validację.. Po za tym co z formularzem? zrezygnowałeś?
To było tak poza tematem..

To dobrze, że chcesz podmienić tę ostatnią galerię.., zupełnie tam nie pasuje, natomiast to co chcesz zrobic jest wypasio i pasuje klimatem!

Poprawiłem co mogłem, za dużo opowiadać.. hmm dam Ci parę tipsów..

Charset..

Po pierwsze ten charset.. Dokument, który masz w załączniku, ma deklarację w UTF-8 i Jest Zapisany w UTF-8, dlatego w opisach piszesz "normalnie" jak np. tu kiedy piszesz posta.. czyli wszystkie polskie "znaczki" dozwolone - ąśżźćłóę blabla Piszesz to normalnie w tych opisach. Zrobiłem test i jest ok (fota w załączniku)
Przypominam i warto to zrobić z powodu konstrukcji tego lightboxa, że do miniatury idzie alt= i dajesz tytuł fotki, a do linka idzie title= i tu dajesz opis fotki.
Warto to zrobić, nie tylko z powodów wizualnych, ale również dla odwiedzających, żeby wiedzieli co oglądają..


Fotki..

Gł. powodem tego, że pocięte grafiki nie chcą trzymać się razem, tylko są szczeliny, jest to, że np. mamy mini grafikę w linku i przenosimy do nowego wiersza np. <img.. albo </ a> - skutkiem czego widzimy różne szczelinki.. Warto zwrócić na to uwagę, kiedy grupujemy fotki, np. tak jak Ty w tzw. "chmurę fotek", czy też kiedy mamy do czynienia z pociętym layoutem..
W tym wypadku warto jechac jednym ciągiem czyli tu gdzie kończy się link, zaczynamy kolejny, a wszystko jednym ciągiem.. zobaczysz w pliku..
Jeśli już tak mamy, to fotki są jedna na drugiej i wręcz sklejone, wtedy dajemy padding, margin i mamy to co chcemy, w tym wypadku dałem padding = 1px i wyszło bardzo gustownie i delikatnie, jak chcesz większe odstępy, to zwiększ ten padding w stylach w .gallery img {}
Dałem fotkę jak to wyszło, (w załączniku)


Trochę przemodelowałem te style i wszystko chodzi jak należy, jest wyśrodkowane i zgrabnie ułożone na stronie, ale również przechodzi validacje (fota w załączniku)

Zapakowałem plik index.html i style do lokal.zip (w załączniku) - pobierz, rozpakuj i podmień pliki, zeby zobaczyć czy jest ok. Jeśli jest wporzo, to daj właściwe opisy itd.

W wolnej chwilce podrzuć mi resztę plików to spróbuję Ci te pliki poprawić i napiszę co i dlaczego.. ew. pytaj o wszystko!

Pozdrawiam
roco

[Rico Roco]

hehe znowu zaczepiłem o tego topa.. i przyszło mi cos do głowy..
- myślałeś o tym, że mogłoby to np. wygladać tak:



Większą fotę daję do załącznika. Zapakowałem to ponownie, zmienione + dołożyłem fotki jak to wyglądało pod innymi przegladarkami.. Np. "zasłonka" pod Operą była tylko do połowy.., pod IE backgroud był mocno przesunięty w dół itd.. Zrobiłem kilka fotek i całość zapakowałem do lokal1.zip (w załączniku).
Jak zobaczysz te fotki, to sam stwierdzisz, że lipka.. była.. Ale z niczym nie pękaj, zrobisz jedną druga i sqmasz o co biega.. to łatwe, tylko potrzeba odrobinkę uwagi..
BTW. jeśli zrobisz z tego taką formę pocztówki, to nawet kiedy ustawisz padding na 0 to też będzie wypasio, nie mówię, że lepiej, ale również wypasio..,
- czyli całkiem bez przerw.. (druga fota w załączniku)

Pomyślałem, że za mało Ci napisałem o charsecie..
Chodzi o to, że nie wystarczy dac deklaracji w meta że to np. utf-8, kiedy było np. iso-8859-2, należy to jeszcze przekonwertowac, albo zapisac takim edytorem, który pozwoli Ci to zapisac z dowolnym kodowaniem, wtedy konwersja nastąpi automatycznie..
A u Ciebie jest teraz tak, że kiedy wybierzesz kodowanie w iso to jest ok, a krzaki pojawiają się przy utf'ie. W plikach które Ci dałem jest już ok i wpisujesz tam normalnie ąśźń itp..

Ok. porzerz te wszystkie pliki i popatrz jak to wyglada itp..

Pozdrawiam
roco

[pyot]

Roco.
Dziękuję ponownie.
Sorki,że dopiero odpisuję ale wiesz - święta
Zaglądałem tu wcześniej,pobrałem co mi oferowałeś.
Ale...
Masz piękny layout ,przynajmniej top,resztę widzę w totalnej rozsypce -piszę w prawym dolnym rogu,coś się sypie...

Spóźnione ale szczere -Wesołych Świąt 

[Rico Roco]

Elo Pyot!

Niczym się nie przejmuj! Ja w ogóle nie chodze spać i mam nadzieję, że uda mi się na czas z projektami przed końcem roku..

Dla Ciebie również Zdrowych Pogodnych Świąt BN i Szczęśliwego Dostatniego Nowego Roku! 

Lay jest świąteczny, w styczniu zniknie jako defaultowy. Nie wiem co masz na myśli: ",resztę widzę w totalnej rozsypce -piszę w prawym dolnym rogu,coś się sypie..." - to jakiś joke? Jakiej przeglądarki używasz - IE w wersji 6? Nie czytasz tego co piszą w netświecie? IE jest koniem trojańskim dla systemu, możesz stracić wszystkie dane, jeśli kożystasz z IE szczególnie z wersji poniżej 7..
Ja już nigdzie nie mam IE6 więc nie mam nawet jak sprawdzić.. po za tym.. zubożać wygląd tylko po to, żeby sprzyjać już nie rozwijanym i badziewnym przeglądarkom? hehe

Jeśli piszemy, że lay się sypie, lub coś jest w rozsybce, to mamy na myśli, że np. jakieś elementy nachodzą na siebie, lub są nie zgrane, "uciekają" gdzieś po za itp.. więc.. hmm nie bardzo kaman...
Za to sypie "śnieg".. mam kilka skryptów i wszystkie spowalniają stronę, więc na początku stycznia usunę skrypt.. Wolałem ten skrypt, króry daje ciekawy i pasujący do reszty efekt, reaguje również na zachowanie kursora.. Inne to już klasyczne płatki śniegowe, lecz niestety w tej skórce padają tylko do połowy..

Myślę, więc, że miałeś na myśli "padający śnieg" i to nim "sypie".. Jeśli coś innego się rozsypało, to proszę o screena..

Pozdrówka
roco

[pyot]

IE nie używam w ogóle,ale Twoje porównanie go do trojana...
Napisałem,że lay się sypnął  i tak było.Wszedłem ledwo na forum aby pokazać,że żyję i pisałem w prawym dolnym rogu ekranu ,nie wiem jak się to nazywa,ale okienko do pisania tekstu tam właśnie się znajdowało
Główna treść  stronki,zjechała jakoś na sam dół.
Szkoda,że nie zrobiłem zrzutu,pokazałbym Ci.
Przeglądałem liskiem.
Fajny top,Ty robiłeś (grafika) ?

I weź się chłopie prześpij...
Pozdrawiam.

[Rico Roco]

Wyśpię się w grobie hehe już nie długo w grudniu 2012..

To ciekawe co piszesz.. Mam FF w wersji 2.0.0.20 i 3.0.5, mam kilka Oper itp.., teraz dla testu jestem tu starym FF, czyli 2xx i nic takiego nie widzę..
Mam takie zasady, że nie wypuszczam nic do neta, dokąd nie przejdzie wszystkich testów.. na localhoście i testowym servie w necie.., są to zasady, których trzymam się od 2003 roku i to na bardzo poważnie.. Nie mogę sobie pozwolić na jakieś kasztaństwo netowe..

Jest szybka odpowiedź, pod ostatnim postem na dole, po zalogowaniu i normalne pisanie posta, czy odpowiedzi. Kiedy piszesz "normalnie" czyli nie przez "szybką odpowiedź" - to masz edytor na górze, a posty w odwrotnej kolejności pod spodem, czyli pod edytorem i polem typu "texarea"

Może za bardzo jesteś przywiązany do skryptu IPB, na którym jest SE? Może wolne łącze i się nie załadowało wsio jak należy? Moze miałeś rozdziałkę 800x600 hmm to takich nie obsługujemy hehe

Co do tego stylu, to top wykonał DzinerStudio.. (piszą skórki do For na skrypcie SMF), za to wykonałem szereg różnych modyfikacji w wielu plikach, nie tylko dlatego, że ludzie z błędami piszą, ale również dlatego, że mam własne wizje, jak mógłby wyglądać np. post itp..

Pyot, please.. jak następnym razem zobaczysz jakiś bullshiter, to bądź miły i machnij screena, ok? zależy mi żeby było tu bezobciachowo, ponieważ chciałbym, żeby userzy dobrze się tu czuli i mieli wsio co możliwe..

Pozdrawiam
roco

[pyot]

Machnę screnna.
Rozdzielczość mam wyższą,to pewne.
Na SE pisałem z sto lat temu albo dalej - wiesz,te errory mnie wkurzały.
Łącze jeden mega .
Ale jak wchodzę tu,to i tak jest dosyć ciężko,wolniej się wszystko ładuje,czy to wina Twoich zabawek ?
 

Pozdrawiam.