Jump to content

Search the Community

Showing results for tags 'проклятые DIVы'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Development
    • HTML Coding
    • JavaScript
    • PHP
    • CMS
    • Database
    • Web Server
    • Web-site Development
    • Internet Marketing, SEO
  • Library
    • Tricks and solutions
    • Books
  • Commercial services
    • Freelance
    • Job
    • Goods and Services
  • Our Forum
    • Flame
    • Contests
    • Feedback and Ideas

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Web site


Telegram


Signal


Viber


Skype


From


Interests

Found 1 result

  1. Товарищи, давайте поможем все дружно мне!))Пытаюсь сделать анимацию, когда плавно подымается div1 наверх он должен волочить за собой другой div2, который растягиваясь закрывает страницу div3.Так же и обратно, когда div1 отпускается он сворачивает этот div2, который открывает div3. Так вот, div1 плавно двигается по странице это получилось,а вот чтоб он тащил за собой div2 ну ни как, ведет себя как вздумается, и еще не знаю как его свернуть(может чё подскажите??? html <div id="div3" style="height: 100%;align-self: center;width: 28%;background-color:yellow;position:absolute; float: none;"> <div style="width: 100%; height: 18%; background-color: #253fff; z-index:999; position: absolute" id="div1"></div> <div id="div2" style="border:none; position: absolute; z-index: 99; width: 27.8%; height: 0%; bottom: 0px; background:blue"> </div> </div><script> var topNum = 0; var maxTop = $('#div3').height() - $('#div1').height(); function onPan(ev) { if(ev.type == 'panstart'){ //console.log("topNum"+topNum); topNum = $('#div1').position().top; } else if(ev.type == 'panend' || ev.type == 'pancancel'){ console.log("topNum"+topNum+"ev.deltaY"+ev.deltaY); if(topNum + ev.deltaY < maxTop * 0.3){ $('#div1').animate({'bottom': 0}, 300); $('#div2').animate({'bottom': 0}); } else if(topNum + ev.deltaY >= maxTop * 0.3 && topNum + ev.deltaY <= maxTop * 0.8){ $('#div1').animate({'top': maxTop * 0.6}, 300); $('#div2').animate({height:'500'},330); } else { $('#div1').animate({'top': maxTop}, 300); $('#div2').animate({'height': maxTop}, 330); } } if(topNum + ev.deltaY < 0 || topNum + ev.deltaY > maxTop) return; $('#div1').css('top', topNum + ev.deltaY); $('#div2').css('top', topNum + ev.deltaY); } var hammer = new Hammer.Manager(document.getElementById('div1')); hammer.add(new Hammer.Pan({ direction: Hammer.DIRECTION_VERTICAL, threshold: 10 })); hammer.on("panstart panmove panend pancancel", onPan);</script>
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy