Skocz do zawartości

^Krzysiek

Rejestracja: 06 kwi 2015
Poza forum Ostatnio: maj 30 2015 14:35
-----

Moje tematy

Katalog plików z możliwością ich pobierania

09 kwietnia 2015 - 13:03

Witam.

Na swojej stronie umieściłem button, który odsyła do katalogu /dok w którym mam luźno umieszczone pliki pdf ze skanami dokumentów. Po przejściu buttonem do tego katalogu wyświetla się Index of z tymi właśnie plikami. Można je pobrać za pomocą kliknięcia prawym przyciskiem myszy i zapisaniu linku jako plik.pdf lub wczytaniu tego pliku w przeglądarce (o ile zainstalowana jest wtyczka która to umożliwi, nie wiem czy są one domyślne w przeglądarkach czy nie).

 

Ja natomiast chciałbym, żeby znajdował się jeszcze fizyczny odsyłacz/przycisk do pobrania danego pliku na dysk. Po co? Z tego względu, że nie wiem jacy klienci będą do mnie trafiać. Ktoś kto jest obeznany w komputerach, będzie wiedział że taki plik może pobrać klikając ppm, albo od razu wczytując go w przeglądarce. Ale może trafić się ktoś, kto nie będzie wiedział co ma z tym zrobić. Poza tym taka opcja "Pobierz" przyśpieszy tą czynność, bo pomijamy w tym momencie żmudne klikanie ppm, wybieranie "Zapisz link jako" itd.

 

A może istnieje jakiś skrypt gdzie można umieścić te pliki, zamiast otwierania gołego Index of /dok ?

 

TNqc4mE.jpg

Mam nadzieję że dość jasno to opisałem. Z natury jestem kombinatorem i niestety lubię utrudniać sobie życie  :P

 

Pozdrawiam!


Grafika w <div> jako odsyłacz

07 kwietnia 2015 - 23:16

Witajcie. Nie wiem czy logicznie nazwałem ten temat. Ale przechodzę do rzeczy. Mam na stronie powstawiane w osobnych div'ach grafiki. Teraz chciałbym zrobić z nich odsyłacze do poszczególnych stron i katalogów. Szukam i szukam w poradnikach, ale jakoś nie mam pomysłu jak tu zadziałać.

Rozrysowałem o co mi chodzi:

SIDOljy.jpg

 

Kod HTML:

<!DOCTYPE HTML>
<html>
   <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Usługi Transportowe Andrzej Bielawski</title>
    <link rel="stylesheet" href="css/style.css">

</head>
 
   <body oncontextmenu="return false" onselectstart="return false" onselect="return false" oncopy="return false" ondragstart="return false" ondrag="return false" onbeforeprint="document.body.style.visibility = 'hidden'; alert('Wydruk jest niedostępny!')" onafterprint="document.body.style.visibility = 'visible'">
      <div id="wrappaer"></div>
      <div class="body"></div>
      <div class="top">
         <div class="flag1"></div>  #flaga polski jako odsyłacz do pl.html
         <div class="flag2"></div>  #flaga niemiec jako odsyłacz do de.html
         <div class="flag3"></div>  #flaga anglii jako odsyłacz do uk.html
         <div class="butt"></div>   #przycisk dokumenty jako odsyłacz do katalogu /dok na serwie
         <div class="cont"></div>   #przycisk kontakt jako odsyłacz do kontakt.php
      </div>
      <div class="line"></div>
      <footer></footer>

   </body>
</html>

Kod CSS:

@charset "utf-8";
/* CSS Document */

#wrapper{width: auto; height: auto;}


body {
	background-image: url(../images/bg.png)
}

.top{
	width: 804px;
	height:143px;
	margin-left: auto;
	margin-right: auto;
	background-image: url(../images/1.png);
	position: relative;
}

.top .flag1 {
    width: 24px;
    height: 24px;
    position: absolute;
    left: 464px;
    bottom: 66px;
    background-image: url(../images/4.png);
}
 
.top .flag2 {
    width: 24px;
    height: 24px;
    position: absolute;
    left: 491px;
    bottom: 66px;
    background-image: url(../images/5.png);
}

.top .flag3 {
    width: 24px;
    height: 24px;
    position: absolute;
    left: 518px;
    bottom: 66px;
    background-image: url(../images/6.png);
}
 
.top .butt {
    width: 95px;
    height: 26px;
    position: absolute;
    left: 545px;
    bottom: 65px;
    background-image: url(../images/7.png);
}

.top .cont {
    width: 95px;
    height: 26px;
    position: absolute;
    left: 644px;
    bottom: 65px;
    background-image: url(../images/10.png);
}

.line{
	width: 804px;
	height: 286px;
	margin-left: auto;
	margin-right: auto;
	background-image: url(../images/2.png);
}

footer{
	width: 804px;
	height: 280px;
	margin-left: auto;
	margin-right: auto;
	background-image: url(../images/3.png);
}

Pozdrawiam!


Przesuwana galeria jQuery

07 kwietnia 2015 - 00:48

Witajcie. Chcę dodać na swoją stronę przesuwaną galerię bazującą na jQuery. Dokładnie jest to:

http://bxslider.com/examples/manual-show-without-infinite-loop

Na stronie głównej podana jest instrukcja. Nie bardzo wiem, co mam zrobić z punktem 3cim, gdzie umieścić ten kod:

$(document).ready(function(){
  $('.bxslider').bxSlider();
}); 

http://bxslider.com/

Tak wygląda mój index.html :

<!DOCTYPE HTML>
<html>
   <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Usługi Transportowe Andrzej Bielawski</title>
    <link rel="stylesheet" href="css/style.css">
<!-- jQuery library (served from Google) -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<!-- bxSlider Javascript file -->
<script src="js/jquery.bxslider.min.js"></script>
<!-- bxSlider CSS file -->
<link href="lib/jquery.bxslider.css" rel="stylesheet" />
<script type="text/javascript">
$('.bxslider').bxSlider({
  infiniteLoop: false,
  hideControlOnEnd: true
});
</script>
</head>
 
   <body oncontextmenu="return false" onselectstart="return false" onselect="return false" oncopy="return false" ondragstart="return false" ondrag="return false" onbeforeprint="document.body.style.visibility = 'hidden'; alert('Wydruk jest niedostępny!')" onafterprint="document.body.style.visibility = 'visible'">
      <div id="wrappaer"></div>
      <div class="body"></div>
      <div class="top">
         <div class="flag1"></div>
         <div class="flag2"></div>
         <div class="flag3"></div>
         <div class="butt"></div>
      </div>
      <div class="line"></div>
      <footer></footer>
<ul class="bxslider">
  <li><img src="images/fot1.jpg" /></li>
  <li><img src="images/fot2.jpg" /></li>
  <li><img src="images/fot3.jpg" /></li>
</ul>
   </body>
</html>

Plik jquery.bxslider.min.js mam w katalogu o nazwie "js", natomiast jquery.bxslider.css w "lib".

Zdjęcia wyświetlają mi się normalnie, a nie w sliderze.


Grafika zmienia położenie - rozdzielczość

06 kwietnia 2015 - 18:00

Witam. Opiszę pokrótce z czym mam problem.
 
Otóż stworzyłem stronę dla mojej firmy. Opiera się ona na 3 plikach graficznych - górze, środku i stopce. Są one wyśrodkowane, tak aby na każdym monitorze znajdowały się na środku.
 
Problem natomiast mam z 4 grafikami, które w przyszłości mają być przyciskami. Na grafice poniżej zobrazowałem co i jak. Chcę, żeby znajdowały się one cały czas w pozycji oznaczonej numerem 1. niezależnie od rozdzielczości monitora. Na mniejszych rozdzielczościach są przesunięte na prawo, natomiast na większych w lewo.
 
Niestety nie potrafię tego zrobić poprawnie, domyślam się że to przez parametry pozycji np. dla pierwszej flagi left: 821px; bottom: 90px; tylko w jaki inny sposób mam je ustawić w odpowiednim miejscu.
 
Grafika:
UYeFB5v.jpg
 
Kod HTML:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>strona</title>
<link rel="stylesheet" href="css/style.css">
</head>
 
<body>
<div id="wrappaer"></div>
<div class="body"></div>
<div class="top"></div>
<div class="flag1"></div>
<div class="flag2"></div>
<div class="flag3"></div>
<div class="butt"></div>
<div class="line"></div>
<footer></footer>
<body oncontextmenu="return false">
<body onselectstart="return false" onselect="return false" oncopy="return false">
<body ondragstart="return false" ondrag="return false">
<body onbeforeprint="document.body.style.visibility = 'hidden'; alert('Wydruk jest niedostępny!')" onafterprint="document.body.style.visibility = 'visible'">
</body>
</html>
 
Kod CSS:

@charset "utf-8";
/* CSS Document */
 
#wrapper{width: auto; height: auto;}
 
 
body {
    background-image: url(../images/bg.png)
}
 
.top{
    width: 804px;
    height:143px;
    margin-left: auto;
    margin-right: auto;
    background-image: url(../images/1.png);
}
 
.line{
    width: 804px;
    height: 286px;
    margin-left: auto;
    margin-right: auto;
    background-image: url(../images/2.png);
}
 
.flag1{
    width: 24px;
    height: 24px;
    float: left;
    position: relative;
    left: 821px;
    bottom: 90px;
    background-image: url(../images/4.png);
}
 
.flag2{
    width: 24px;
    height: 24px;
    float: left;
    position:relative;
    left: 826px;
    bottom: 90px;
    background-image: url(../images/5.png);
}
.flag3{
    width: 24px;
    height: 24px;
    float: left;
    position:relative;
    left: 831px;
    bottom: 90px;
    background-image: url(../images/6.png);
}
 
.butt{
    width: 95px;
    height: 26px;
    float: left;
    margin-left: auto;
    margin-right: auto;
    position:relative;
    left: 836px;
    bottom: 90px;
    background-image: url(../images/7.png);
}
 
footer{
    width: 804px;
    height: 280px;
    margin-left: auto;
    margin-right: auto;
    background-image: url(../images/3.png);
}
 
Pozdrawiam, liczę na pomoc.