Skocz do zawartości

Zdjęcie
* * * * * 1 głosy

Pomocy!

Rozpoczął Qbax, mar 27 2013 15:23
Pomocy

7 odpowiedzi w tym temacie
  • Zaloguj się, aby dodać odpowiedź
Qbax

    Nowy użytkownik

  • 3 postów
    • :
0
Neutralna

Napisano 27 marca 2013 - 15:23

#1

Witam,

Od razu przepraszam, jeżeli nie tu umieszczamy takie posty!

Chciałem aby na moim blogu pojawił się rotator/przewijacz, taki jak np. na http://www.itvregion.pl [po prawej], w którym banner zmienia się co 4-6 sekund. Przejrzałem dokładnie zasoby internetu, i nic takiego nie ma, a jeżeli jest, to nie działa [nie wiem czemu]. Od razu piszę, że mój blog, na Bloggerze, niestety nie obsługuje Flash'a. Czy jakiś dobry Webmaster mógłby pomóc mi w napisaniu kodu HTML, lub polecić jakąś stronę?? Proszę o pomoc...;(


  • 0
zonic

    WT Elite

  • 2 911 postów
    • Czas spędzony online: 134d 2h 28m 23s
472
Znakomita!
  • LocationToruń

Napisano 27 marca 2013 - 20:05

#2

Witam,

Od razu przepraszam, jeżeli nie tu umieszczamy takie posty!

Chciałem aby na moim blogu pojawił się rotator/przewijacz, taki jak np. na http://www.itvregion.pl [po prawej], w którym banner zmienia się co 4-6 sekund. Przejrzałem dokładnie zasoby internetu, i nic takiego nie ma, a jeżeli jest, to nie działa [nie wiem czemu]. Od razu piszę, że mój blog, na Bloggerze, niestety nie obsługuje Flash'a. Czy jakiś dobry Webmaster mógłby pomóc mi w napisaniu kodu HTML, lub polecić jakąś stronę?? Proszę o pomoc...;(

Witaj.
Może coś takiego Cię zadowoli?
http://www.jsmadeeas...cript/index.htm

 

http://www.astral-co.../doco.cgi?11530


  • 0

Papierowe wizytówki NFC

ernest
6
Neutralna

Napisano 27 marca 2013 - 22:37

#3

W samym HTML raczej nie da się zrealizować tego, żeby wyglądało tak jak na przykładzie.
JS jest w tym przypadku najlepszym rozwiązaniem i na podstawie powyższych dwóch linków powinieneś sobie poradzić. Jeśli miałbyś problemy, pisz tutaj.


  • 0
Qbax

    Nowy użytkownik

  • 3 postów
    • :
0
Neutralna

Napisano 28 marca 2013 - 13:58

#4

Wyglądał on tak:
 

<html>

  <head>
 
    <style>
      #Slideshow1 img {height:250px; width:500px}
    </style>
   
    <script type="text/javascript" src="slideshowmerge.js"></script>

  </head>
 
  <body>
 
    <h1>Merging Slideshow</h1>

    <script>

      var imgArray = new Array();
      imgArray[0] = "images/squeeze.jpg";
      imgArray[1] = "images/pat.jpg";
      imgArray[2] = "images/turner.jpg";

      slideshowMerge('Slideshow1','',imgArray,20,5000);
   
    </script>

  </body>
 
</html>


 
 
Po mojej modyfikacji, tj. po dodaniu zdjęć i adresu url wyglądał tak:
 

<html>

  <head>
 
<style>
      #Slideshow1 img {height:250px; width:500px}
    </style>
   
    <script type="text/javascript" src="slideshowmerge.js"></script>

 
 
 
 
    <h1>Merging Slideshow</h1>

    <script>

      var imgArray = new Array();
      imgArray[0] = "http://www.zrodlokromolow.zafriko.pl/pics/BUTTONLKS.png"; <url>www.zrodlokromolow.zafriko.pl<url>
      imgArray[1] = "http://oi53.tinypic.com/34dofvl.jpg"; <url>www.kibicewarty.futbolowo.pl
      imgArray[2] = "http://www.olimpiawlodowice.pl/images/button.gif"; <url>www.olimpiawlodowice.pl<url>

      slideshowMerge('Slideshow1','',imgArray,20,5000);
   
    </script>

Nie wiem gdzie wstawić ten skrypt. Ja próbowałem tak. Pobrałęm kod, zmodyfikowałem, i nie wiem co jest źle. Jestem ciemny w JS, a w HTML nie znam się fachowo :(


  • 0
zonic

    WT Elite

  • 2 911 postów
    • Czas spędzony online: 134d 2h 28m 23s
472
Znakomita!
  • LocationToruń

Napisano 28 marca 2013 - 14:40

#5

Prosiłbym Cię o edycję posta i użycie odpowiednich tagów do dodawania kodu. Ciężko się to czyta w takiej wersji.

Podstawowe pytani.
Wrzuciłeś też skrypt js, który w przykładzie nosi nazwę slideshowmerge.js ?

Bo tutaj mówisz tylko o samym HTMLu


  • 0

Papierowe wizytówki NFC

Qbax

    Nowy użytkownik

  • 3 postów
    • :
0
Neutralna

Napisano 28 marca 2013 - 15:02

#6

Wyglądał on tak:
 

<html>

<head>

<style>
#Slideshow1 img {height:250px; width:500px}
</style>

<script type="text/javascript" src="slideshowmerge.js"></script>

</head>

<body>

<h1>Merging Slideshow</h1>

<script>

var imgArray = new Array();
imgArray[0] = "images/squeeze.jpg";
imgArray[1] = "images/pat.jpg";
imgArray[2] = "images/turner.jpg";

slideshowMerge('Slideshow1','',imgArray,20,5000);

</script>

</body>

</html>

 

 
 
Po mojej modyfikacji, tj. po dodaniu zdjęć i adresu url wyglądał tak:
 

<html>

<head>

<style>
#Slideshow1 img {height:250px; width:500px}
</style>

<script type="text/javascript" src="slideshowmerge.js"></script>





<h1>Merging Slideshow</h1>

<script>

var imgArray = new Array();
imgArray[0] = "http://www.zrodlokromolow.zafriko.pl/pics/BUTTONLKS.png"; <url>www.zrodlokromolow.zafriko.pl<url>
imgArray[1] = "http://oi53.tinypic.com/34dofvl.jpg"; <url>www.kibicewarty.futbolowo.pl
imgArray[2] = "http://www.olimpiawlodowice.pl/images/button.gif"; <url>www.olimpiawlodowice.pl<url>

slideshowMerge('Slideshow1','',imgArray,20,5000);

</script>


 

Nie wiem gdzie wstawić ten skrypt. Ja próbowałem tak. Pobrałęm kod, zmodyfikowałem, i nie wiem co jest źle. Jestem ciemny w JS, a w HTML nie znam się fachowo :(


  • 0
zonic

    WT Elite

  • 2 911 postów
    • Czas spędzony online: 134d 2h 28m 23s
472
Znakomita!
  • LocationToruń

Napisano 28 marca 2013 - 15:14

#7

Masz w swoim kodzie linijkę:

<script type="text/javascript" src="slideshowmerge.js"></script>

 

Oznacza to, że w tym samym folderze, co dany kod HTML powinieneś mieć plik o nazwie slideshowmerge.js o zawartości:
 

//=======================
 //
 // Merging Image Slideshow
 //
 // http://www.astral-consultancy.co.uk/cgi-bin/hunbug/doco.cgi?11530
 //
 //=======================

 var slideshowMergeAnimate = new Array();
 var slideshowMergeTimer   = new Array();
 var slideshowMergeCount   = new Array();
 var slideshowMergeImages  = new Array();

 //======================

 function slideshowMerge(id,cl,imageArray,fadeInterval,holdTime)
 {

   for(i=0;i<imageArray.length;i++)
   {
     var imgLoad = new Image();
     imgLoad.src = imageArray[i];
   }

   if(cl)
     cl = ' class="'+cl+'"';

   document.write('<div id="'+id+'"'+cl+' style="position:relative">');
   document.write('<img id="'+id+'img1" style="position:absolute; top:0px; left:0px;" onload="slideshowMergeRun(\''+id+'\')"/>');
   document.write('<img id="'+id+'img2" style="position:absolute; top:0px; left:0px;display:none;"/></div>');
   
   slideshowMergeCount[id]   = 0;
   slideshowMergeImages[id]  = imageArray;
   slideshowMergeAnimate[id] = 'run';
   slideshowMergeTimer[id]   = setInterval('slideshowMergeAnimation(\''+id+'\',\''+holdTime+'\');',fadeInterval);

 }

 //======================

 function slideshowMergeAnimation(id,holdTime)
 {
   if(slideshowMergeAnimate[id]=='run')
   {
     var obj1 = document.getElementById(id+'img1');
     var obj2 = document.getElementById(id+'img2');

     var opa  = slideshowMergeCount[id]%100;

     if(opa==0)
     {  
       if(obj1.src)
       {
         slideshowMergeAnimate[id] = 'hold';
         setTimeout('slideshowMergeRun(\''+id+'\')',holdTime);
         obj2.src = obj1.src;
         obj2.style.display = 'block';
       }
     }
     else if(opa==1)
     {
       slideshowMergeAnimate[id] = 'load';
       obj1.src = slideshowMergeImages[id][Math.floor(slideshowMergeCount[id]/100)%slideshowMergeImages[id].length];
     }
       
     obj1.style.opacity = (opa/100).toString();
     obj1.style.filter  = "alpha(opacity="+opa.toString()+")";
     obj2.style.opacity = ((100-opa)/100).toString();
     obj2.style.filter  = "alpha(opacity="+(100-opa).toString()+")";
      
     slideshowMergeCount[id]++;
     
     if(slideshowMergeCount[id]==(slideshowMergeImages[id].length*100))
       slideshowMergeCount[id]=0;
   }
 }

 //======================

 function slideshowMergeRun(id)
 {
   slideshowMergeAnimate[id] = 'run';
 }

 //======================

 

Nie sprawdzałem tego. Rozwiązanie wzięte z: http://www.astral-co.../doco.cgi?11530
Jeśli nadal nie będzie działać to daj znać. Odpalę notepad++ i spróbuję Ci pomóc.

 


  • 0

Papierowe wizytówki NFC

unbreak

    WT Elite

  • 1 937 postów
    • Czas spędzony online: 27d 8h 43m 36s
506
Znakomita!
  • Location/home/unbreak

Napisano 26 października 2013 - 16:49

#8

Po 1 ten skrypt nie obsługuje klikania w grafikę, po 2 błędnie zrobiłeś to:

var imgArray = new Array();
imgArray[0] = "http://www.zrodlokromolow.zafriko.pl/pics/BUTTONLKS.png"; <url>www.zrodlokromolow.zafriko.pl<url>
imgArray[1] = "http://oi53.tinypic.com/34dofvl.jpg"; <url>www.kibicewarty.futbolowo.pl
imgArray[2] = "http://www.olimpiawlodowice.pl/images/button.gif"; <url>www.olimpiawlodowice.pl<url>

Użytkownik unbreak edytował ten post 26 października 2013 - 16:49

  • 0

webDeveloper

Wróć do HTML i CSS


Użytkownicy przeglądający ten temat: 0

0 użytkowników, 0 gości, 0 anonimowych