Jump to content


Photo

[Rozwiązany] Rodzielczość a plik

Started by szczurzecie, 25 Jan 2011 19:34

  • This topic is locked This topic is locked
20 replies to this topic

#1 szczurzecie

szczurzecie
  • Użytkownicy
  • 72 posts

Posted 25 January 2011 - 19:34

Witam,
chciałbym żeby otwierała mi sie dana strona dla danej rozdzielczości.
Napisałem taki skrypt ale nie działa gdyż cały czas otwierami plik 1920.html.
Proszę o pomoc.
<!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" /> 
<title>AoE TEAM</title> 
</head> 
 
<body> 
<script type="text/javascript"> 
            if (screen.width < 1024) {
                        window.location = '1024.html';
            }
	    if (screen.width < 1280) {
                        window.location = '1280.html';
            }
	    if (screen.width < 1680) {
                        window.location = '1680.html';
            }
	    if (screen.width < 1920) {
                        window.location = '1920.html';
            }
            else {
                        window.location = 'indexx.html';
            }
</script>
</body> 
 
</html>


[ Dodano: 2011-01-26, 17:19 ]
Temat do zamknięcia.
Rozwiazanie:
<!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" /> 
<title>AoE TEAM</title> 
</head> 
 
<body> 
<script type="text/javascript"> 
           if (screen.width < 1024) {
           window.location = '1024.html';
}else{
           if ((screen.width < 1280) && (screen.width >= 1024)) {
                        window.location = '1280.html';
            }else{
                        if ((screen.width < 1680) && (screen.width >= 1280)) {
                                       window.location = '1680.html';
                        }else{
                                       if ((screen.width < 1920) && (screen.width >= 1680)) {
                                                      window.location = '1920.html';
                                      }else{
                                                      window.location = 'indexx.html';
                                      }
                        }
            }
}</script>
</body> 
 
</html>

  • 0

#2 magik092

magik092
  • Użytkownicy
  • 1555 posts

Posted 26 January 2011 - 17:21

Hmmm....
<!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" />
<title>AoE TEAM</title>
</head>
 
<body>
<script type="text/javascript">
            if (screen.width <= 1024) {
                        window.location = '1024.html';
            }
        else if (screen.width <= 1280) {
                        window.location = '1280.html';
            }
        else if (screen.width <= 1680) {
                        window.location = '1680.html';
            }
        else if (screen.width <= 1920) {
                        window.location = '1920.html';
            }
            else {
                        window.location = 'indexx.html';
            }
</script>
</body>
 
</html>

Ten kod śmiga znakomicie.

Osobiście wolałbym jednak zmieniać proporcje obiektów zależnie od rozdzielczości zamiast przerzucać użytkownika na inny plik.
  • 0

Posted Image

#3 szczurzecie

szczurzecie
  • Użytkownicy
  • 72 posts

Posted 26 January 2011 - 17:23

JA osobiście wolał bym to zrobic w php ale nie potrafie :wht:
  • 0

#4 magik092

magik092
  • Użytkownicy
  • 1555 posts

Posted 26 January 2011 - 17:24

Mam jedno ale co do kodu:
Jeśli użytkownik ma rozdzielczość 1024x768 przerzucasz go do pliku 1280. Nie może tak być.
Poza tym za bardzo nakombinowane warunków ^^"
  • 0

Posted Image

#5 szczurzecie

szczurzecie
  • Użytkownicy
  • 72 posts

Posted 26 January 2011 - 17:26

No w sumie racja :wht:
Ale czy jest jakaś metoda na to?
bo to jest strona we flashu tylko jak ją zrobic zeby na każdej rozdzielczosci otwierał się inny plik flasha na tej samej stronie??
  • 0

#6 magik092

magik092
  • Użytkownicy
  • 1555 posts

Posted 26 January 2011 - 17:31

Polecam poczytać o AJAX'ie =P
Ściągnij bibliotekę jQuery i w dokumentacji wyczytasz (czy też Google) jak wysłać proste pytanie, odebrać dane.

Użytkownik wchodzi na stronę (przywitasz go gifem/loaderem)->wysyłasz zapytanie do pliku php (bądź html) gdzie jest osadzony swf->AJAX wypełnia danym plikiem (czyli objektem flash) jakiegoś div'a i tym samym użytkownik jest na stronce dostosowanej do jego rozdzielczości, gdzie nie został przerzucony do innego pliku :wht:
  • 0

Posted Image

#7 szczurzecie

szczurzecie
  • Użytkownicy
  • 72 posts

Posted 26 January 2011 - 17:37

Ale strona będzie często zmieniana a to duzo zabawy..
  • 0

#8 magik092

magik092
  • Użytkownicy
  • 1555 posts

Posted 26 January 2011 - 17:46

To zmian będziesz dokonywał tylko w tym pliku php (/html) w którym osadzasz Flash'a :wht:
  • 0

Posted Image

#9 szczurzecie

szczurzecie
  • Użytkownicy
  • 72 posts

Posted 26 January 2011 - 17:48

To na jakiej zasadzie będzie raz plik dla małej rozdzielczosci a raz dla dużej?
I będę zmieniał plik flash nie html..
  • 0

#10 magik092

magik092
  • Użytkownicy
  • 1555 posts

Posted 26 January 2011 - 17:54

Tym lepiej :wht:

Użytkownik wchodzi na stronę->pobierasz od użytkownika szerokość ekranu->wysyłasz zapytanie AJAX'em do np. 1024.html->AJAX osada dane z pliku w powiedzmy div'ie wrapper o powierzchni całego dokumentu.

Jak czegoś nie rozumiesz pisz.
  • 0

Posted Image

#11 szczurzecie

szczurzecie
  • Użytkownicy
  • 72 posts

Posted 26 January 2011 - 22:01

Mogę wiedzieć dokładnie jak zrobić tego ajaxa (krok po kroku)??
  • 0

#12 magik092

magik092
  • Użytkownicy
  • 1555 posts

Posted 27 January 2011 - 15:38

Ściągasz bibliotekę stąd (zapisujesz do pliku jQuery.js), następnie w sekcji HEAD strony wstawiasz ten pliczek
<script type="text/javascript" src="jQuery.js"></script>
dodajesz jeszcze:
<script type="text/javascript">
function getData()
{
	var usc;
	if (screen.width <= 1024) {
		usc = '1024';
	}
	else if (screen.width <= 1280) {
		usc = '1280';
	}
	else if (screen.width <= 1680) {
		usc = '1680';
	}
	else if (screen.width <= 1920) {
		usc = '1920';
	}
	else {
		usc = 'default';
	} 
	$.ajax({
		type: "GET",
		url: usc+".html", // lub "get.php?scr="+usc, pomysłów cała masa <img src='http://ok.dfirma.pl/public/style_emoticons/<#EMO_DIR#>/fake-smile.gif' class='bbc_emoticon' alt=':wht:' />
		success: function(msg){
			if(strlen(msg)>0)
				$("#body_area").html(msg);
			$("#body_area").html("<div id='error'>Wystąpił błąd przy pobieraniu danych. Proszę spróbować ponownie później.
<a onclick=\"getData()\" style=\"cursor:pointer;\">Spróbuj pobrać dane</a>.");
		},
		error : function()
		{
			$("#body_area").html("<div id='error'>Wystąpił błąd przy pobieraniu danych. Proszę spróbować ponownie później.
<a onclick=\"getData()\" style=\"cursor:pointer;\">Spróbuj pobrać dane</a>.");
		}
	});
}
</script>
Cały dokument wyglądał by, więc tak:
!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" /><!-- polecałbym ISO-8859-2 -->
<title>AoE TEAM</title>
<script type="text/javascript" src="jQuery.js"></script>
<script type="text/javascript">
function getData()
{
	var usc;
	if (screen.width <= 1024) {
		usc = '1024';
	}
	else if (screen.width <= 1280) {
		usc = '1280';
	}
	else if (screen.width <= 1680) {
		usc = '1680';
	}
	else if (screen.width <= 1920) {
		usc = '1920';
	}
	else {
		usc = 'default';
	} 
	$.ajax({
		type: "GET",
		url: usc+".html", // lub "get.php?scr="+usc, pomysłów cała masa <img src='http://ok.dfirma.pl/public/style_emoticons/<#EMO_DIR#>/fake-smile.gif' class='bbc_emoticon' alt='=P' />
		success: function(msg){
			$("#body_area").html(msg);
		},
		error : function()
		{
			$("#body_area").html("<div id='error'>Wystąpił błąd przy pobieraniu danych. Proszę spróbować ponownie później.
<a onclick=\"getData()\" style=\"cursor:pointer;\">Spróbuj pobrać dane</a>.");
		}
	});
}
</script>
</head>
<body>
<div id="body_area"><div id="loading">Proszę czekać...</div></div>
<script>getData();</script>
</body></html>

Gdzie w plikach 1024.html, 1280.html, 1680.html, 1920.html i default.html osadzasz odpowiednio Flash'a, w CSS pozycjonujesz sobie #body_area (100% szerokości i 100% wysokości okna rozdzielczości użytkownika), #loading (jakiś prosty gif/loader + wyśrodkowane, z lekkim marginesem górnym) i #error (zawsze trzeba przewidzieć wystąpienie błędu, wyśrodkować i lekki margines górny).

Staram się tłumaczyć w prosty sposób ale może mi nie wychodzić ^^"
  • 0

Posted Image

#13 szczurzecie

szczurzecie
  • Użytkownicy
  • 72 posts

Posted 27 January 2011 - 18:19

Zrobiłem, ale jest mały problem...
Jak wejdziesz na http://aoe.halffree.pl/ to cały czas wyświetla się "!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
"..
Jakiś pomysł?
  • 0

#14 magik092

magik092
  • Użytkownicy
  • 1555 posts

Posted 28 January 2011 - 15:31

Trochę samodzielności :)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org
zamiast
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org
w pierwszej linijce dokumentu, jak kopiowałem z edytora, o znak za daleko zaznaczyłem ^^"
  • 0

Posted Image

#15 szczurzecie

szczurzecie
  • Użytkownicy
  • 72 posts

Posted 28 January 2011 - 16:22

Działa :)
Dzięki za pomoc.
Teraz mam jeszcze dwa pytanka:)

Pierwsze to jak w ajaxie wyświetlać stronę w html'u tzn. będę miał plik 1.html i plik index.html i chcę zeby był odnośnik że jak nacisnę 1 na stronie to przeczodzi pod 1.html bez zmiany linku?

Za to drugie pytanie, to jak zmienić kolor linków po lewej stronie i kolor tekstu ceny w koszyku po prawej stronie (http://tatoo.halffree.pl ? Pytam gdyż męczę się z tym 2-gi dzien i nie wiem :D
  • 0

#16 magik092

magik092
  • Użytkownicy
  • 1555 posts

Posted 29 January 2011 - 00:03

Jeden, zmień skrypt na :
function getData(target)
{
    var usc;
    if (screen.width <= 1024) {
        usc = '1024';
    }
    else if (screen.width <= 1280) {
        usc = '1280';
    }
    else if (screen.width <= 1680) {
        usc = '1680';
    }
    else if (screen.width <= 1920) {
        usc = '1920';
    }
    else {
        usc = 'default';
    }
    usc += ".html";
    if(typeof(target)!="undefined")
        usc = target;
    $.ajax({
        type: "GET",
        url: usc, // lub "get.php?scr="+usc, pomysłów cała masa <img src='http://ok.dfirma.pl/public/style_emoticons/<#EMO_DIR#>/fake-smile.gif' class='bbc_emoticon' alt=':)' />
        success: function(msg){
            $("#body_area").html(msg);
        },
        error : function()
        {
            $("#body_area").html("<div id='error'>Wystąpił błąd przy pobieraniu danych. Proszę spróbować ponownie później.
<a onclick=\"getData()\" style=\"cursor:pointer;\">Spróbuj pobrać dane</a>.");
        }
    });
}

i teraz link wyglądał by tak:
[url="#"]nazwa linku[/url]
Ewentualnie mógłbym udostępnić swoją bibliotekę ale to już na PW, linki wyglądałyby np. tak:
[url="#!/link.html"]nazwa[/url]


[ Dodano: 2011-01-29, 00:05 ]
Co do drugiej to już działania na pliku CSS (polecam kurs CSS).
  • 0

Posted Image

#17 szczurzecie

szczurzecie
  • Użytkownicy
  • 72 posts

Posted 29 January 2011 - 22:40

Ok, inaczej.
Chcę zrobić stronę pisaną w html'u ale żeby się wyświetlała w ajaxie.
Jak to zrobić żebym miał stronę ajaxowska ale zebym pisał sobie w htmlu?
  • 0

#18 magik092

magik092
  • Użytkownicy
  • 1555 posts

Posted 01 February 2011 - 15:41

Studniówka mnie zatrzymała :P

Pliki nie odróżniają się od zwykłych HTML'owskich.
Po w/w przykładzie możesz sobie stworzyć własny kod wczytujący HTML'a w czasie rzeczywistym za pomocą AJAX'a.
Tworzysz stronkę sample.html, następnie w pliku głównym osadzasz kod jak z przykładu i chcąc wczytać plik podmieniasz zmienną usc na swój adres.
Wymogiem jest plik umieszczony na tym samym serwerze :P
  • 0

Posted Image

#19 szczurzecie

szczurzecie
  • Użytkownicy
  • 72 posts

Posted 01 February 2011 - 15:47

Zrobiłem ale on zamiast wyświetlać przekierowuje mnie..
  • 0

#20 magik092

magik092
  • Użytkownicy
  • 1555 posts

Posted 03 February 2011 - 00:20

Masz to gdzieś na neta wrzucone ?
  • 0

Posted Image

Back to Webmastering

1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users

  1. Forum Komputerowe PCFoster.pl
  2. → Programy (Software)
  3. → Webmastering
  4. Privacy Policy
  5. Regulamin ·