kots

Myślę, że to narzędzie może być przydatne dla designerów. Mogą projektować strony dokładnie tak jak mają wyglądać w przeglądarce bez przekłamań z PS czy innego programy do edycji grafiki. Łatwiej to później przekuć w "kod produkcyjny", tj. taki który później łatwo modyfikować w razie dodawania nowych modułów do strony, kompresować, bezboleśnie aktualizować. @olaf "podejrzewam że każda większa firma ma już własne tego typu rozwiązanie osadzone gdzieś w pipelinie" Być może. Jednak osobiście nie sądzę, że tak jest.Jest to zbyt ślamazarne rozwiązanie, zwłaszcza dla średniej/dużej wielkości projektów, gdzie pracuje cała drużyna. Sass, Less, Stylus czy inny preprocessor to obecnie podstawa. Połączone z narzędziem takim jak Grunt czy Gulp oferują prawdziwą MOC. Mój preferowany zestaw narzędzi to Sass + Compass/Bourbon + Grunt (odnośnie CSS). Ponadto proszę pamiętać o czymś takim: Flash. Potężne narzędzie o bardzo rozbudowanym GUI. Tylko programiści potrafią wycisnąć z niego 110%. ;) Pewne rzeczy łatwiej ugryźć od strony kodu IMO. Linki: http://sass-lang.com/ http://lesscss.org/ http://learnboost.github.io/stylus/ http://gruntjs.com/

MEGA! Co za niesamowity, mały film. Jestem pod wrażeniem!

Hmm. Jeśli można wiedzieć: w jakim celu chcesz podawać php informację o tym czy JS jest dostępny czy też nie? :)

Witaj QubisieQ, możesz np. dodać klasę "jsOff" na body a później natychmiast ją usunąć za pomocą JS. Przykładowy kod w jQ: $('body').removeClass('jsOff'); To wszystko. :)

To ja też się podczepię pod tę dyskusję. :P Zgadza się, że JavaScript (czyli w zasadzie ECMAScript: http://en.wikipedia.org/wiki/ECMA_Script) jest trochę starszy od Flasha. Co więcej ActionScript (czyli język skryptowy Flasha) pochodzi od JS. Są bardzo podobne do siebie jeżeli chodzi o strukturę. Taka ciekawostka! Te fakty nie mają jednak wielkiego ponieważ bardzo dużo się zmieniło od tych zamierzchłych czasów. @ola-f "do materiałów interaktywnych się nie nadaje" [chodzi chyba o cały HTML 5 tutaj :) ] Nadaje, nadaje. To wszystko jeszcze raczkuje i zobaczymy co z tego (HTML 5) wyrośnie. Rokuje dobrze. Wielu ludzi robi świetne rzeczy w JS i nie zapowiada się na to, że nagle skończą. A że coś chodzi wolno, "muli" – proszę wziąć pod uwagę, że w sporej części to wynika z niewiedzy programisty, lub często "programisty". Naprawdę. Druga sprawa, że by robić wydajne rzeczy w JS trzeba mieć niezłą wiedzę. Nie ma łatwo. Za Flashem nie ma co płakać moim zdaniem. Było, minęło (jeżeli chodzi o strony internetowe, nie o gry i aplikacje). Z resztą i na HTML też kiedyś przyjdzie czas, trzeba się będzie przestawić na coś nowego. Jak zawsze. @adek Jeżeli chodzi o ten googlowy Dart, to raczej ma konkurować z JS po stronie serwera (http://nodejs.org/). O ile mi wiadomo nic nie zapowiada, że Google próbuje po cichu zamienić JavaScript na Dart po stronie klienta. ;) I jeszcze dodam, że miałem zawsze problem by nauczyć się Flasha. Może to przez interfejs, który mnie odstraszał(!). Odwlekałem Flashowe tutoriale i ani się spostrzegłem, a zacząłem coraz lepiej radzić sobie z HTML, CSS i JS. Dziwne. ;) http://media.smashingmagazine.com/wp-content/uploads/2011/01/smashing_39_big.png

@adek – To głównie zależy od zawartości strony, im bardziej napakowana treścią (np. Facebook :) ), tym większe będzie obciążenie procka no i będą przycinki. Da się jeszcze zoptymalizować ten skrypt (który i tak just bardzo prosty), ale cudów bym się nie spodziewał. Niestety. @ola-f – Dzięki. Owszem, zabija. Kropka. :) Wiedziałem od początku, że tak będzie. :P Gdyby myśleć o jakimś poważnym wykorzystaniu tego skryptu, to wypadałoby zoptymalizować kod obracanej treść (maksymalnie prosty) oraz zredukować rozdzielczość na ile to tylko możliwe. Na urządzeniach mobilnych w ogóle bym zrezygnował z takich bajerów. Strona mobilna ma, w moim rozumieniu, działać na maksymalnej ilości możliwych sprzętów. Ale to takie co by było gdyby. :)

Cześć, właśnie napisałem taki głupawy skrypt: http://animacjejs.pl/spin/ i chciałem się nim podzielić z resztą świata. ;) Uwaga: trzeba mieć nową przeglądarkę. :P

To nie jest film o tym co nas czeka, a o tym co jest.

Witaj QbisieQ, Miałeś błędzik w deklaracji zmiennej w funkcji. Teraz jest dobrze: <br /> <br /> <br /> function setTheme (theme)<br /> {<br /> if(theme == "red")<br /> document.write('<link rel="stylesheet" href="'+theme+'.css" type="text/css">');<br /> else if(theme == "green")<br /> document.write('<link rel="stylesheet" href="'+theme+'.css" type="text/css">');<br /> else<br /> document.write('<link rel="stylesheet" href="green.css" type="text/css">');<br /> }<br /> <br /> setTheme("");<br /> <br /> Dodatkow sugeruję nie używać "==", a "===". "Podwójne porównanie" jest bardziej podatne na błędy: http://www.impressivewebs.com/why-use-triple-equals-javascipt/. function setTheme (theme) { if(theme === "red") document.write(''); else if(theme === "green") document.write(''); else document.write(''); } setTheme(""); Pozdrawiam, Artur

Popraw tylko te zmultiplikowane id żeby się któremuś zainteresowanemu stronka nie rozjechała. :P Większość przeglądarek powinna to ogarnąć, ale mogą być problemy. Serio, serio. A co do kodu - wiem, że stać Cię na więcej. Nie usprawiedliwiaj się tylko do roboty. ;)

Hej Torm! Wizualnie jest spoko. :) Przydałoby się popracować nad tym o czym wspomniał @adek Nawigacja strzałkami oraz "scrollem" w myszce byłaby naprawdę fajna. A co do kodu. :) Dalej operujesz wyłącznie divami co nie jest dobrym rozwiązaniem. Przynajmniej logo mogłoby być w : TOMB - Tomasz Bieńkowski Brakuje też , atrybuty alt w są puste. Tzn. - ok. - Twoja sprawa. Jeśli chcesz utrudnić wyszukiwarkom robotę... ;) Używasz też kilku identyfikatorów o tej samej nazwie (np. id="img1" powtarza się kilka razy). TO BŁĄD. MOŻE PROWADZIĆ DO NIEPOPRAWNEGO DZIAŁANIA STRONY. Używaj klas w takich przypadkach. W CSS często używasz np: "div.logo", "ul.menu", itp. Jedyne co "div" robi w "div.klasa" to spowalnianie działania selektora. Oczywiście czasami zachodzi potrzeba rozróżnienia elementów np.: "div.off" i "section.off" - klasa może oznaczać co innego w takim przypadku. Nie ma to jednak miejsca w przypadku Twojej strony w związku z tym polecam poprawę selektorów. Zupełnym nonsensem jest używanie np. "li#tel" zamiast po prostu "#tel". IDENTYFIKATOR MOŻE BYĆ TYLKO JEDEN NA DANEJ STRONIE, ograniczanie go selektorem elementu nie ma uzasadnienia. Na koniec JS. Dwie sprawy, które od razu rzucają się w oczy. Nie keszujesz obiektów jQuery ($) co wpływa negatywnie na wydajność skryptu. Za każdym razem gdy używasz $('#drukContainer'), a używasz wieeeele razy, jQuery będzie wykonywało nowy obiekt (nie, nie sprowadza się to tylko do wyszukania elementu tak jak w CSS :P). Stąd najlepszym rozwiązaniem jest "zapisanie" obiektu w zmiennej np.: var $internetContainer = $('#internetContainer'); // później możesz sobie używać (a nie wytwarzać od nowa) zapisany w zmiennej element np: if($internetContainer.hasClass('deactive')){ $internetContainer.animate({ marginLeft: '269px' }, 1000, 'easeInQuint', function() { // Animation complete. }); $internetContainer.removeClass('deactive'); $internetContainer.addClass('active'); } } Druga sprawa to używanie oldschoolwego onclick w HTMLu. :) Rozumiem - działa, aaaale... Można to zrobić lepiej (zwłaszcza jeśli masz jQuery na pokładzie). :) Weźmy np.: </pre> <ul class="imgChanger"> 1 2 3 4 5 6 7 </ul Zamiast tego sugeruję odkurzyć HTML: </pre> <ul class="imgChanger"> 1 2 3 4 5 6 7 </ul A w JS dodać: // proszę zwrócić uwagę: inaczej niż w CSS ul.imgChanger zadziała szybciej niż .imgChanger - taki smaczek :) // http://hungred.com/useful-information/jquery-optimization-tips-and-tricks/ // find jest duuużo szybsze niż $('ul.imgChanger li') // http://api.jquery.com/category/traversing/ // używam alternatywy dla .click - efekt ten sam // http://api.jquery.com/on/ $('ul.imgChanger').find('li').on('click', function() { // $(this) = element który został kliknięty // $(this).index() = numer elementu (od góry) // UWAGA: pierwszy element = 0, drugi = 1, trzeci = 2, itd. // dlatego dodaję 1 - w ten sposób będzie to zgodne z nazewnictwem które przyjąłeś shiftImageInternet($(this).index()+1); }); Nie będę się już więcej rozwlekał. ;) Podsumowując: projekt fajny, kod (zwłaszcza HTML) - niestety słabo. Pozdrawiam, Artur

Hej! Projekt mi się całkiem podoba, eksponuje fotografie, które są ŚWIETNE. Temat kodu sobie odpuszczę. Takie widoki przyprawiają mnie, front-end developera, o palpitacje serca. ;) Jeżeli chodzi o to by link (np. "przyroda" w portfolio) "przewijał" bezpośrednio na wysokość działu ze zdjęciami: należy dodać na elemencie otaczającym dział (lub znajdującym się na tej wysokości) identyfikator np.: id="portfolio-przyroda". Następnie link kierujący do wspomnianego działu zmodyfikować w następujący sposób PRZYRODA No i załatwione. Chyba, że miałeś coś innego na myśli @dziadek3D? :) Pozdrawiam, Artur

Witam! Projekt generalnie mi się podoba. Jest prosto, do rzeczy, czuć siatkę. Daleko od ideału, ale uderza w przyjazne mi estetycznie obszary. Deseń w tle możesz wymienić, czy nie pochodzi on z Mac OS Lion? Poza tym zbyt długo się ładuje (tło). Za dużo waży. Kropka. Możesz przyśpieszyć przewijanie slajdów. Zdają się przesuwać trochę zbyt leniwie. Jeżeli chodzi o kod to niestety jest słabo. Strefa treści ("content") ma zablokowaną wysokość, powinna się rozciągać w zależności od ilości tekstu (obrazków, list, etc.). Rozumiem, że masz tam zamiar zamieścić krótką notatkę o sobie jednak jest to niedopuszczalne jeżeli piszesz kod dla kogoś innego. Nadużywasz elementów , polegasz w dużej mierze na identyfikatorach (co prawda w projekcie tej skali ma to średnie znaczenie w nieco większych to byłby strzał w stopę). Poczytaj sobie o tagach w HTMLu: http://html5doctor.com/ Pozdrawiam, Artur

To jeszcze chmury w CSS 3: http://www.clicktorelease.com/code/css3dclouds/ :)

http://playpit.kowareru.com/ - Takie tam demka. Przyjemne dla oka jak sądzę. :)