Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [inny]jquery-problem z pojawiajacym sie tekstem
pollock
post
Post #1





Grupa: Zarejestrowani
Postów: 8
Pomógł: 0
Dołączył: 21.11.2008
Skąd: Londyn

Ostrzeżenie: (0%)
-----


witam,
realizuje projekt strony na ktorej jest tlo rozciagajace sie na caly format strony.
Mam problem z tekstem i funkcja fadeIn ktora w tej konfiguracji nie chce zadzialac.
Jest to tylko przyklad ale jestem wobec niego bezsilny.
Podaje kod ktory nie dziala.

Prosze o pomoc.
Kod
<!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>Supersized - Full Screen Background/Slideshow jQuery Plugin</title>
<script src="jquery-1.4.min.js" type="text/javascript"></script>



  <script type="text/javascript">
    
     $(document).ready(function()
{
         // fade in content.
         $( '#content-wrapper' ).fadeIn("slow");        
});

    
    
     $(function(){
         $.fn.background.options = {  
             startwidth: 1024,  
             startheight: 768,
             minsize: .50,
             slideinterval: 5000  
         };
         $('#background').supersized();
     });





</script>
        

     <style type="text/css">
     #content-wrapper
{
     display:none;    
}


*{
             margin:0;
             padding:0;
             font:60px "Gotham Black", Arial, sans-serif;
             color:#FFF;
         }
         img{
             border:none;
         }
         body {
             overflow:hidden;/*Needed to eliminate scrollbars*/
         }
         #content{
             margin:0px auto;
             height:100px;
             width:100%;
             bottom:5%;
             background-color:#262626;
             border-top:3px solid #4F4F4F;
             border-bottom:3px solid #4F4F4F;
             position:absolute;
         }
         #contentframe{
             text-align:center;
         }
        
         /*Supersize Plugin Styles*/
         #supersize img, #supersize a{
             height:100%;
             width:100%;
             display:none;
         }
         #supersize .activeslide, #supersize .activeslide img{
             display:inline;
         }




     </style>
</head>

<body>

<div id="supersize">
     <a class="activeslide"><img src="spinka_web/images/background.jpg" name="supersize" id="supersize"=></a>
<div id="content-wrapper">
  
The page content goes here!
  
</div><!-- content-wrapper -->


</body>
</html>
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi
pollock
post
Post #2





Grupa: Zarejestrowani
Postów: 8
Pomógł: 0
Dołączył: 21.11.2008
Skąd: Londyn

Ostrzeżenie: (0%)
-----


Witam,
Wszystko dziala za wyjatkiem niepoprawnego wyswietlania tla.
W firefox jest ok natomiast pod IE pojawiaja sie scrolle oraz po prawej stronie bialy pasek.
Czyli tlo nie wypelnia calosci ekranu tak jak powinno byc.
Co jest nie tak?

Kod
<script src="javascript/jquery-1.4.min.js" type="text/javascript"></script>
<script type="text/javascript" src="supersized.1.0.js"></script>


<script type="text/javascript">
    
      $(document).ready(function()
{
  
        $('#apDiv2').fadeIn(5000);      
});      
      
      
      $(document).ready(function()
{
  
        $('#apDiv1').fadeIn(5000);      
});
      $(document).ready(function()
{
  
        $('#apDiv6').fadeIn(5000);      
});

       $(document).ready(function()
{
  
        $('#apDiv4').fadeIn(5000);      
});

       $(document).ready(function()
{
  
        $('#apDiv5').fadeIn(5000);      
});


      $(document).ready(function()
{
  
        $('#apDiv8').fadeIn(5000);      
});


      $(document).ready(function()
{
  
        $('#apDiv7').fadeIn(5000);      
});


      $(document).ready(function()
{
  
        $('#apDiv10').fadeIn(5000);      
});

      $(document).ready(function()
{
  
        $('#apDiv9').fadeIn(5000);      
});

       $(document).ready(function()
{
  
        $('#apDiv11').fadeIn(5000);      
});

$(function(){
             $.fn.supersized.options = {  
                 startwidth: 1024,  
                 startheight: 768,
                 minsize: .50,
                 slideinterval: 5000
             };
             $('#supersize').supersized();
            
      
         });
</script>
        

     <style type="text/css">




#content-wrapper
{
     display:none;    
}


*{
             margin:0;
             padding:0;
             font:60px "Gotham Black", Arial, sans-serif;
             color:#FFF;
         }
         img{
             border:none;
         }
         body {
             overflow:hidden;/*Needed to eliminate scrollbars*/
         }
         #content{
             margin:0px auto;
             height:100px;
             width:100%;
             bottom:5%;
             background-color:#262626;
             border-top:3px solid #4F4F4F;
             border-bottom:3px solid #4F4F4F;
             position:absolute;
         }
         #contentframe{
             text-align:center;
         }
        
         /*Supersize Plugin Styles*/
         #supersize img, #supersize a{
             height:100%;
             width:100%;
             display:none;
         }
         #supersize .activeslide, #supersize .activeslide img{
             display:inline;
         }





     #apDiv1 {
    display:none;
    position:absolute;
    left:922px;
    top:250px;
    width:264px;
    height:328px;
    z-index:31;
}
  
}
#apDiv10 {
    display:none;
    position:absolute;
    left:646px;
    top:298px;
    width:354px;
    height:340px;
    z-index:40;
}
     .style4 {
    font-size: 15px;
    font-family: Arial, Helvetica, sans-serif;
}

#apDiv11 {
    display:none;
    position:absolute;
    left:634px;
    top:268px;
    width:354px;
    height:69px;
    z-index:40;
}
.style16 {
    font-size: 22px
}
.style18 {font-size: 16px}
     </style>
</head>

<body>
<div id="apDiv1"><img src="images/frame1.gif" width="196" height="235" /></div>
<div id="apDiv2"><img src="images/frame3.gif" width="236" height="292" /></div>
<div id="apDiv4"><img src="images/frame7.gif" width="208" height="169" /></div>
<div id="apDiv5"><img src="images/frame5.gif" width="216" height="184" /></div>
<div id="apDiv6"><img src="images/frame2.gif" width="348" height="244" /></div>
<div id="apDiv7"><img src="images/frame8 copy2.gif" width="278" height="346" /></div>
<div id="apDiv8"><img src="images/frameadres2.gif" width="453" height="209" /></div>
<div class="style4" id="apDiv9">ul.1 Maja 16/2D, 75-800 Koszalin, tel: 607 964 813</div>
<div class="none" id="apDiv10">
  <div align="left">
    <p class="style12">
    <ul>
      <li class="style18">kolczyki</li>
      <li class="style18">korale</li>
      <li class="style18">pierścionki</li>
      <li class="style18">bransoletki</li>
      <li class="style18">biżuteria z kamieni<br />
      naturalnych</li>
      <li class="style18">paski</li>
      <li class="style18">klipsy</li>
      <li class="style18">ozdoby do włosów</li>
      <li class="style18">broszki</li>
    </ul>
    <p class="style18">&nbsp;</p>
  </div>
</div>

<div class="style16" id="apDiv11">Asortyment:</div>

<div id="supersize">
    <a class="activeslide" ><img  src="images/background.jpg"/></a>
    <a href="http://interfacelift.com/wallpaper_beta/details/1787/eye_on_the_world.html"><img src="images/lense.jpg"/></a>
</div>
</body>
</html>


Ten post edytował pollock 27.01.2010, 19:06:55
Go to the top of the page
+Quote Post

Posty w temacie


Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 16.09.2025 - 02:34