Autorius Tema: Animate nesamones daro  (Skaityta 3939 kartus)

Neprisijungęs Haris

  • Dalyvis
  • **
  • Įrašai: 833
  • Karma: +56/-0
    • Žiūrėti profilį
    • www.RubikoKubas.Lt
Animate nesamones daro
« Įrašytas: 2010-05-06 20:36:28 pm »
Pasidariau toki dalykėli ir išbadžius visas naršykles Opera nesamones rodė.
Kodas: (javascript) [Pasirinkti]
$('#divas').hover(function() {
$('#divas').animate({"bottom": "20"},"slow")
});

Šitas daiktas pastumia diva i virsu 20 pixeliu , bet Opera , vos uzvedus , tas divas skrieja į puslapio viršų ir staiga atsiranda kur jam reikia būti ir tada tik normaliai, pagal skriptas paslenka į viršų.

WTF? kodėl taip nutinka?
« Paskutinį kartą keitė: 2010-05-06 23:14:21 pm sukūrė Haris »

Neprisijungęs Lukas

  • Administratorius
  • Herojus
  • ******
  • Įrašai: 7431
  • Karma: +232/-15
    • Žiūrėti profilį
Re: Animate nesamones daro
« Atsakymas #1 Įrašytas: 2010-05-07 11:26:44 am »
o netruksta parasyti 20px, o ne tiesiog 20?
Jūsų draugas, kolega ir puslapio administratorius,

Lukas.

Gerda Photography
Serveriai.lt 50% nuolaida!
Free Hosting
Free Templates

Neprisijungęs Haris

  • Dalyvis
  • **
  • Įrašai: 833
  • Karma: +56/-0
    • Žiūrėti profilį
    • www.RubikoKubas.Lt
Re: Animate nesamones daro
« Atsakymas #2 Įrašytas: 2010-05-07 20:29:17 pm »
dadėjau px , bet vistiek , tas pats .  ;D

Neprisijungęs Lukas

  • Administratorius
  • Herojus
  • ******
  • Įrašai: 7431
  • Karma: +232/-15
    • Žiūrėti profilį
Re: Animate nesamones daro
« Atsakymas #3 Įrašytas: 2010-05-08 12:10:03 pm »
o bandei kopint koki pvz is jquery psl ir paziuret ar veikia?
Jūsų draugas, kolega ir puslapio administratorius,

Lukas.

Gerda Photography
Serveriai.lt 50% nuolaida!
Free Hosting
Free Templates

Manualai.lt Forumas

Re: Animate nesamones daro
« Atsakymas #3 Įrašytas: 2010-05-08 12:10:03 pm »

Neprisijungęs Haris

  • Dalyvis
  • **
  • Įrašai: 833
  • Karma: +56/-0
    • Žiūrėti profilį
    • www.RubikoKubas.Lt
Re: Animate nesamones daro
« Atsakymas #4 Įrašytas: 2010-05-08 16:42:16 pm »
sito nebandziau , o gali buti del divo kuriame yra tas blokas kuris turi pakilti ?

Neprisijungęs Lukas

  • Administratorius
  • Herojus
  • ******
  • Įrašai: 7431
  • Karma: +232/-15
    • Žiūrėti profilį
Re: Animate nesamones daro
« Atsakymas #5 Įrašytas: 2010-05-08 16:45:15 pm »
gal ir gali, pabandyk jquery pvz panaudot
Jūsų draugas, kolega ir puslapio administratorius,

Lukas.

Gerda Photography
Serveriai.lt 50% nuolaida!
Free Hosting
Free Templates

Neprisijungęs polas

  • Naujokas
  • *
  • Įrašai: 20
  • Karma: +0/-2
    • Žiūrėti profilį
Re: Animate nesamones daro
« Atsakymas #6 Įrašytas: 2010-08-13 20:36:54 pm »
Zmogau varyk y google ir parasyk jquery animate ir gausi visa isamu jo sarasa kaip,kur ir kas 8)

Neprisijungęs Macaque

  • Dalyvis
  • **
  • Įrašai: 861
  • Karma: +26/-0
  • makakuje.
    • Žiūrėti profilį
Re: Animate nesamones daro
« Atsakymas #7 Įrašytas: 2010-08-13 21:19:36 pm »
Va pažiūrėk čia - http://api.jquery.com/animate/ veikia ant Operos ;)
„Tik vienas dalykas gali svajonę padaryti neįgyvendinamą: tai baimė, kad nepasiseks. “ - Paulo Coelho

Rekomenduoju pirkti domenus iš - IV.lt

Neprisijungęs Haris

  • Dalyvis
  • **
  • Įrašai: 833
  • Karma: +56/-0
    • Žiūrėti profilį
    • www.RubikoKubas.Lt
Re: Animate nesamones daro
« Atsakymas #8 Įrašytas: 2010-08-13 21:39:01 pm »
Tas man irgi veikia, tik vat būtent mano kodas taip daro.

Neprisijungęs Macaque

  • Dalyvis
  • **
  • Įrašai: 861
  • Karma: +26/-0
  • makakuje.
    • Žiūrėti profilį
Re: Animate nesamones daro
« Atsakymas #9 Įrašytas: 2010-08-13 22:52:02 pm »
Tas man irgi veikia, tik vat būtent mano kodas taip daro.

Duok visą kodą, pažiūrėsiu ;]
„Tik vienas dalykas gali svajonę padaryti neįgyvendinamą: tai baimė, kad nepasiseks. “ - Paulo Coelho

Rekomenduoju pirkti domenus iš - IV.lt

Neprisijungęs Haris

  • Dalyvis
  • **
  • Įrašai: 833
  • Karma: +56/-0
    • Žiūrėti profilį
    • www.RubikoKubas.Lt
Re: Animate nesamones daro
« Atsakymas #10 Įrašytas: 2010-08-13 23:01:51 pm »
HTML
    <div id="nav">
    <?php
$ar
=array("index.php","news.php","naudinga.php","straipsniai.php","shop.php","info.php");
$rr=array("Pagrindinis","Naujienos","Naudinga","Straipsniai","Parduotuve","Informacija");
$divs = array("namai","news","pam","str","shop","info");
$url=$_SERVER[&#39;PHP_SELF&#39;];
$r=explode("/",$url);
$ca=count($ar);
for(
$i=0;$i<$ca;$i++){
if($r[1] == $ar[$i]){
$sel="class=\"active\"";$acl="";
$urel="<a href=&#39;$ar[$i]&#39;><div id=&#39;active&#39;>
        
$rr[$i]
        </div></a>"
;
}else{
$urel="<a href=&#39;$ar[$i]&#39;><div id=&#39;$divs[$i]&#39;>
        
$rr[$i]
        </div></a>"
;
}
echo
"$urel";
}

?>

CSS:
/*  NAVIGACIJA  */
#nav{
padding-top:120px;
width:970px;
height:50px;
position:absolute;
z-index:1;
}
/*         Namai               */
#namai{
background-image:url(img/btn/namai.png);
background-repeat:no-repeat;
width:113px;
height:61px;
}
#frm{
background-image:url(img/btn/frm.png);
background-repeat:no-repeat;
width:113px;
height:61px;
}
#news{
background-image:url(img/btn/new.png);
background-repeat:no-repeat;
width:113px;
height:61px;
}
/*         end               */
/*         str               */
#str{
background-image:url(img/btn/str.png);
background-repeat:no-repeat;
width:113px;
height:61px;
}
/*       end                 */
/*         shop               */
#shop{
background-image:url(img/btn/shop.png);
background-repeat:no-repeat;
width:113px;
height:61px;
}
/*       end                 */
/*        pam                */
#pam{
background-image:url(img/btn/pamokos.png);
background-repeat:no-repeat;
width:113px;
height:61px;
}
/*       end                 */
/*        info                */
#info{
background-image:url(img/btn/info.png);
background-repeat:no-repeat;
width:113px;
height:61px;
}
#active{
background-image:url(img/btn/active.png);
background-repeat:no-repeat;
width:113px;
height:61px;
bottom:20px;
}
/*       end                 */
#namai , #str , #pam , #info,#active,#shop,#news,#frm{
float:left;
margin-left:10px;
padding:5px 0px 0px 5px;
margin-right:10px;
margin-top:15px;
font-family:Verdana, Geneva, sans-serif;
font-size:18px;
color:#000;
position:relative;
text-decoration:none;
}
#namai a, #str a, #pam a, #info a, #active a, #shop a, #news a, #frm a{
color:#000;
}
#namai:hover, #str:hover, #pam:hover, #info:hover, #active:hover, #shop:hover, #news:hover, #frm:hover{
color:#fff;
text-decoration:none;
}
/*        END       */

JS
$(document).ready(function() {
$('#namai').hover(function() {
$('#namai').animate({"bottom": "20px"},"slow")
});
$('#namai').mouseleave(function() {
$('#namai').animate({"bottom": "-=20px"},"slow")
});
$('#frm').hover(function() {
$('#frm').animate({"bottom": "20"},"slow")
});
$('#frm').mouseleave(function() {
$('#frm').animate({"bottom": "-=20"},"slow")
});
$('#news').hover(function() {
$('#news').animate({"bottom": "20"},"slow")
});
$('#news').mouseleave(function() {
$('#news').animate({"bottom": "-=20"},"slow")
});

$('#shop').hover(function() {
$('#shop').animate({"bottom": "20"},"slow")
});
$('#shop').mouseleave(function() {
$('#shop').animate({"bottom": "-=20"},"slow")
});

$('#pam').hover(function() {
$('#pam').animate({"bottom": "20"},"slow")
});
$('#pam').mouseleave(function() {
$('#pam').animate({"bottom": "-=20"},"slow")
});

$('#str').hover(function() {
$('#str').animate({"bottom": "20"},"slow")
});
$('#str').mouseleave(function() {
$('#str').animate({"bottom": "-=20"},"slow")
});

$('#info').hover(function() {
$('#info').animate({"bottom": "20"},"slow")
});
$('#info').mouseleave(function() {
$('#info').animate({"bottom": "-=20"},"slow")
});
});

Neprisijungęs Macaque

  • Dalyvis
  • **
  • Įrašai: 861
  • Karma: +26/-0
  • makakuje.
    • Žiūrėti profilį
Re: Animate nesamones daro
« Atsakymas #11 Įrašytas: 2010-08-14 01:26:33 am »
Va, parašiau aš tau švarų "animate" efekto skripto animaciją HTML/CSS/JS , pažiūrėk į mano duotą kodą ir bandyk pritaikyti savajam, be to atkreipk dėmesį į selektorius ;)

<!DOCTYPE html>

<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>untitled</title>
        <script src="http://code.jquery.com/jquery-latest.min.js"></script>
        <style>
            #red { background-color: red; float: left; }
            #blue { background-color: blue; float: left; }
            #green { background-color: green; float: left; }

            #boxes { width: 645px; margin: 10% auto; }

            .box:hover { cursor: pointer; }
            .box { width: 200px; height: 100px; margin-right: 15px; }
        </style>
        <script>
            $(document).ready(function(){
                $(".box").hover(function(){
                    $(this).animate({"marginTop" : "-=50px"}, "slow");
                },
                function(){
                    $(this).animate({"marginTop" : " =50px"}, "slow");
                });
            });
        </script>
    </head>
    <body>
        <div id="boxes">

            <div class="box" id="red"></div>

            <div class="box" id="blue"></div>

            <div class="box" id="green"></div>

        </div>
    </body>
</html>

PASTABA : šitoje eilutėje - $(this).animate({"marginTop" : " =50px"}, "slow"); prirašyk pliuso ženklą :  , pvz.: $(this).animate({"marginTop" : "<čia turi būti pliusas>=50px"}, "slow"); ,nes kažkodėl forumas automatiškai ištrina pliuso ženklą ;]
« Paskutinį kartą keitė: 2010-08-14 16:52:39 pm sukūrė Macaque »
„Tik vienas dalykas gali svajonę padaryti neįgyvendinamą: tai baimė, kad nepasiseks. “ - Paulo Coelho

Rekomenduoju pirkti domenus iš - IV.lt

Manualai.lt Forumas

Re: Animate nesamones daro
« Atsakymas #11 Įrašytas: 2010-08-14 01:26:33 am »