I'm looking to make a mock-up html app. I have been using reveal JS and my own jquery to make the bulk of it, but i need only part of the page to be "sensitive" to the swipe gestures. Does anyone know of a way to make only part of the screen area sensitive?
Thanks
Well put an HTML element there covering the desired area and bind the swipe event to it.
For more of a concept you should try something and comeback with a code example if no success.
Related
I would like triggering an animation when the user is coming to the div which contains the animation. I tried with waypoint and it worked but now I want to try a pure angular solution.
Different options I've found are the following :
angular-waypoint
triggering the event on mouseenter/mouseleave
constantly looking for the position and the scrollbar.
I am not asking for a solution already made, but rather advices!
Thank you.
I'm trying to find a Javascript snippet that I can archive the UIScrollView + UIPageControl effect of the iOS using Javascript and CSS3.
Generating the page control to a dot to each view and do the switching is very easy, but the complicated part it is to do the elastic movement.
I would want to do this myself, but it seems to much work to me, like hours of work, tried googling, but I not found anything. I don't like JQuery but the mobile framework doesn't seems to do this.
If I had to do this by myself, do you guys have any suggested approach? I'm thinking in using a parent div, with a bunch of divs inside for each view. Use the parent with overflow: hidden;
and attach event to the parent view and listen to drags and bind to the horizontal scroll offset. This would be a good way? or using css transitions with left or translate-x would be more smooth?
EDIT:
This is what I tried (not working very well): JSFIDDLE
Yeah,
Im not sure about touch swipes, although i think the 'activate' or 'touchstart' handler might be useful. Using CSS3 transitions to achieve the elastic movement is quite smooth, just alter the left or right style property of your internal div and the transfom will move from its current position to where you need it to be.
This is not the worlds bestt example but have a look here
villasanrafael.eu/Gallery.php
Hey I want to make text scroll from right to left in a div i have. I want this to happen automatically and at a constant flow.
Now when i first started with HTML the tag was used to do this, I've looked around a few websites and it seems that this tag still seems to be going. My question is really if this is the best way of achieving this affect or is there a better way of doing it? for example, javascript,Jquery and/or css Maybe even something in HTML5?
This shows what i am looking - http://www.gftuk.com/
Notice the scrolling stops when the user hovers over the text.
Thanks for the time.
<marquee>hello world</marquee>
Personally, I think the best way to achieve this would be to use jquery. There are a few plugins out there which do the job nicely.
If you want to automatic with "scroll" text ( structure of DOM is not complex) .
<marquee>This text will scroll from right to left</marquee>
But you will see with "marquee" the scroll is not smooth.
So you can use simplyScroll plugin
http://logicbox.net/jquery/simplyscroll/
( I see it in this code of your link : http://www.gftuk.com/. in next time, please open dev tools or firebugs and see source code of any pages when you want to have the same effects )
Hope it helps you
Im busy with an mobile website design, but im not that good with javascript. So i would like to have an startup script which i can modify. So i dont know where to start.
What i want to achieve is the following:
When you click on an button/div (onclick function) an div slides up (change margin top/make an invisble div that slides in height). And on the same click an other div slides open. (So the second div isnt shown at first but on click it is shown.
I dont know if this is possible but im sure you guys know if it is.
Kind regards,
Augus
yeah it can be done easily with Jquery. you can even set sliding speed.
you can check this thread and you can do something similar. I have answered in that thread as well.
or you can do it using below function:
jQuery('#div_id_1').slideDown("slow");
jQuery('#div_id_2').slideUp("slow");
I installed the supersized plugin for wordpress, which is working great. I have set it up as a slideshow to autoplay without control buttons. Still working great.
Now, my client wants to have certain divs (with content) rotate alongside the background image. So, when supersized shows the first image in the slideshow div1 shows on the page. When the slideshow moves to the second slide, div1 needs to go away and show div2, and so on.
Currently, I can do this by hacking into the supersized.js and add a custom function that passes the current slide number inside the nextSlide() function.
Instead of hacking it, though, I would like to hook into it somehow.
Something like: $.supersized.api.currentslide or something similar.
Would this be possible at all?
Thanks!
This example fits with your Answer:
http://www.cirmiz.eu/supersized/
You need to configure a Theme with the init event and api.options.
In this example in the file supersized.shutter.min.js
Requires supersized 3.2.5 ¡important!
I think you are looking for this variable
$.supersized.vars.current_slide
good luck