Jump to content
Search Community

GRAY GHOST

Business

  • Posts

    41

  • Joined

  • Last visited

 Content Type 

Everything posted by GRAY GHOST

1
2
Page 2 of 2  
  1. GRAY GHOST
    When the menu opens on squarespace the ability to click anywhere to close is there (with the exception of the closed state you mentioned). I know this is challenging, but it has been done in the wild many times. Would love to have a great solution here. Again, the code snippet suggested in this initial thread post doesn't allow text selection in WIn7 IE10.
  2. GRAY GHOST
    That's a nice try OSUblake. Unfortunately, text is still hard to select and copy in the first demo you listed http://codepen.io/osublake/pen/2708a9d4f4d2f040f851a33f9caba5cd?editors=001 TO EVERYONE IN THIS THREAD Detecting for touch can have false positives hence the example must support both interactions (touch and mouse). Think about all the Windows products out there today and even iPads that have keyboard and mouse used in conjunction with touch enabled devices.
  3. GRAY GHOST
    I left a link to the squarespace demo in my original thread on the off canvas topic. That's the demo that is sparking this discussion. It's the one where you told me to leave the menu still viewable at 15 pixels.
  4. GRAY GHOST
    What is the correct loading order for GSAP utilities? I see demo's that linger around in varied flavors and all seem to work. Does order really matter in terms of loading? Is it suggested that TweenMax goes before Draggable? or vice versa?
  5. GRAY GHOST
    See this issue started regarding the selectable text approach which is not allowed in IE10. http://greensock.com/forums/topic/11964-select-text-on-draggable
  6. GRAY GHOST
    I just posted about this in my demo for off canvas menu. Hopefully both of us can find a good working solution. This one works great until you drag to left too much (in my case). Also FYI you cannot select text in IE10 this route.
  7. GRAY GHOST
    One more bit I think can tie this up nicely. I'll also make sure to give a shout out for those that lend a hand here to a resolution. The number one problem still is the fact that text is not selectable making it a huge issue for me. I've tried clickableTest, but not sure thats really the best way to go here. I'd like to show people with this demo that… 1. Content can be pushed by the menu in a performant way. 2. It can still be accessible. 3. You can swipe over the draggable region and still interact with the document like a normal website (select text, copy and paste, interact with form inputs etc.) Out of that list #3 with text selection remains. Squarespace would be one example I could point to that does this. Demo link updated: http://codepen.io/grayghostvisuals/pen/569ffceac4b0c1b3958ade9bd189ad94
  8. GRAY GHOST
    Fixed \m/ <a href="#menu" class="menu-toggle" onclick="event.preventDefault()" data-clickable="false">Menu</a> if (event.target.hash && event.target.hash !== '#menu') { return; } else { aria('aria-hidden'); clickit.call(this); }
  9. GRAY GHOST
    Ok so everything is going well so far with the exception of some adjustments I made. I dislike that the menu opens when anchors are clicked. To solve that see the changes I made in the JS. http://codepen.io/grayghostvisuals/pen/569ffceac4b0c1b3958ade9bd189ad94 The only thing left with that pen I just linked is the fact that I lost the menu button to activate the menu. Everything else is working like a charm.
  10. GRAY GHOST
    Thanks for the tips. The demo no longer has the body element in use due to the error you described. BTW the hash trick worked like a charm and changing position to absolute fixed my IE issue on the menu not appearing. Still seeing issues in Safari with menu's height.
  11. GRAY GHOST
    Demo has been updated, but finding some new problems. This is the demo that will appear in Tuts+ when it has been fully tested. Menu won't show when activated in IE10. In Safari the height is completely full for the menu only when the browser is resized. Again this demo has to be the way I've made it without showing 15 pixels of the menu. I also added a hash anchor just to see what happens when a user clicks on a link that leads to another section in the same doc. So far the results are not that great. Hopefully a fix to this? Demo: http://codepen.io/grayghostvisuals/pen/569ffceac4b0c1b3958ade9bd189ad94
  12. GRAY GHOST
    Fixed this by using body as the target and some CSS trickery. Demo has been updated.
  13. GRAY GHOST
    Please Help Guide on this issue. Thanks in advance to those that pitch in Here's an example demo (still private) I'm creating to show how Draggable can be used to create an off canvas menu. http://codepen.io/grayghostvisuals/pen/569ffceac4b0c1b3958ade9bd189ad94 A couple issues I'm running into: 1. The red bg is to show the target region. I want the menu to allow drag actions to open the menu when a user's finger drags over the top of the document (not just a small portion of a region). The menu also hides completely when it's closed. The previous example linked in my demo from Carl's original pen had the menu showing 15 pixels when closed. Need some guidance on how to improve the current demo I'm building. 2. Links in the main document body are not clickable and I think I'm missing the explanation in the docs. Maybe some direction how to make these elements clickable so the menu swipe region does not negate those clickable items.
  14. GRAY GHOST
    Thanks Jonathan
  15. GRAY GHOST
    Carl, Thanks as always for the wonderful amount of info. I actually have a Pen started for the sequential loading effect ala material design, but I also like the additional points you've noted above about playback and other benefits. Mike, This is exactly the idea so that each article of the series grows in complexity and level of understanding. Rodrigo, Thanks for the suggestion. Codrops is definitely an excellent source for inspiration. I'll make sure to use a demo from them that's converted to using GSAP instead of purely CSS. Might be cool to show the performance improvements as well
  16. GRAY GHOST
    This tweet is where it started https://twitter.com/gryghostvisuals/status/556154294823813120 I'm doing a series of tutorials and articles for Tuts+ on TimelineMax so I'm interested in types of effects and demos readers would like to see included in this series. Thanks in advance for your ideas posted \o/
1
2
Page 2 of 2  
×
×
  • Create New...