-
StylePit Lookbook SS14 video animation
I've investigated this and it seems like it animates a the data URI for each frame. Does anyone have experience using this technique? Do data URIs render very quickly? I understand that they do not cache, so is it possible to preload them? Any thoughts would be appreciated! Cheers, Zach
-
StylePit Lookbook SS14 video animation
Hello everyone, An interesting feature has been brought to my attention recently http://www.stylepit.com/lookbook/ Does anyone know how they animated the video? Looking at the html, it seems to be some sort of jpeg image replacement - but how did they accomplish this? I've also seen this technique used on google doodles in the past, and I would love to know how its done. I've used image swaps before using javascript by dynamically changing the image name every few milliseconds (src="/frames/frame-1", src="/frames/frame-2" etc). However, this method is dubious as it has to load the images continously and can cause gaps in the frames and so on. If anyone has any insight into this I would be very interested! Cheers, Zach
-
-
Custom Facebook sharer descriptions
Hello all, Facebook has changed the way the sharer.php process works, and it's broken all the features on the website I work on. It now goes through the URL referenced in the share link and draws text from the page to build the title, description and image for the share post. On the particular site I work on, this text is not relevant and I would like to control the title, description and images myself. I understand I can get around this by using <meta name="description" content="blah blah blah" /> or something like that in the head tag. However, at my work I only have access to the content areas of the site and currently can't go near the <head> tag, without injecting something into it using javascript. Does anyone have any ideas or solutions for this problem? I've requested that we have some editable meta tags, but I'm not sure what the department involved will say. Looking forward to hearing your ideas. Thanks, Zach
-
Help with Thumbnail Grid with Expanding Preview
Also, thinking about you, you could fairly easily recreate the "similar images" feature in with pure HTML/Javascript, but it would be quite manual. If you are not planning on having too many images it could be very managable, using classes or data attributes to group images.
-
Help with Thumbnail Grid with Expanding Preview
Hello Marko, What features do you want to add precisely? Do you want it to work exactly the same as Google images, or do you want to add different features into the drop down box? Google probably uses some sort of advanced server-side script to generate the similar images features and things like that. If you are looking for simpler features, you will probably need to treat them more or less independently from the drop down functionality. Are you familiar with javascript/jQuery? Cheers, Zach
-
Caching videos with javascript
Thanks for the reply Jack, That's more or less what I've done, it works as long as the user's connection is good. The problem is each video involves someone throwing something from one slide to another, if that makes sense. This means the videos have to be running well to get the best effect, so I was hoping to cache it to guarantee this. It has a nice fallback though so hopefully it won't be a big issue.
-
- Javascript & JQuery
-
Caching videos with javascript
Hi everyone, I'm building a video feature which is a slider that has a video autoplaying on each slide. There are about 7 slides so I'm concerned it may not work very efficiently when the user first loads the page. Does anyone know of any way of caching the videos before allowing the user to start scrolling through the feature? I've thought of perhaps playing each video at an increased rate before hiding a pre-loader, but I'm worried this might freeze up the users computer. Anyone have any other solutions? Cheers, Zach
-
[Javascript]What's the difference?
You might want to try something like this: function movebox(speed) { setInterval(function(){ var el = document.getElementById("box"), left = el.offsetLeft, moveBy = 1; el.style.left = left + moveBy + "px"; }, speed); if (left > 399) { clearTimeout(timer); } } ...then call the function as you need it. Haven't checked to see if this works....
-
MP4 motion prediction glitch occuring at start of video (HTML5 video)
Hello everyone, I have a slideshow containing several HTML5 videos which play automatically on load. It works perfectly in Firefox, but in other browsers I am getting what seems like an error with the motion prediction which lasts for about a second before fixing itself. You've probably seen the error before, where the first frame 'blends' with subesquent frames, which usually happens when the image changes suddenly. It's described by wikipedia as: Hopefully that makes sense, it's quite difficult to describe without making a video of it. The error also happens when I play it in quicktime. Has anyone else encountered this problem and know how to prevent it? Cheers, Zach
-
Idea - Project Challenges
Hi all, Like many of you, I enjoy designing and building websites and am keen to constantly develop and practice my skills. To do this, I usually build sites for friends, undertake design contests, or get jobs from freelancing websites. However, this can sometimes be frustrating, and it would be nice to be able to practice my skills purely for the fun of doing it. I have been looking online for some sample web design briefs from which to build a site from, but there are not many out there to choose from. So, I've had the idea of a website for practicing our trade. Here's the concept: A depository of realistic design/development briefs You will be able to download realistic project briefs to work on, probably organised into Easy, Intermediate or Advanced. These can be posted by users. Peer assessment of solutions The users will be able to post their solutions for critical assessment by other users of the website. I'm thinking some sort of voting system could be utilised here. Collaborative work opportunities There will be opportunites for collaborative work. For example, a designer might create the designs in a psd, and another user who might be a developer can code this into a functional website. The project briefs should reflect clearly the distinction between the two tasks. I hope that the concept is clear to everyone. I think it would be great practice for beginners and professionals alike. It could also help with building a portfolio for people just starting out. So my question to the community is: Would you be interested in something like this? I'd love to hear of any ideas you might want to chuck into the mixer. Thanks, Zach
-
Equestrian ecommerce shop (revamp
Hmm... interesting point. I've really struggled with the colours - I've been trying to use the ones on the logo and it's been very difficult for me to find something that works. I'll try experimenting with the colours a bit.
-
Equestrian ecommerce shop (revamp
Hi all, I think this is at least my third revamp of this site - it's an equestrian shop site for my aunt's shop. You can see the design at http://www.zachtownsend.co.uk/testpage.html. I look forward to any feedback and advice you give. Thanks, Zach
-
-
E-Commerce theme design
Hi all, I am creating an e-commerce site which I hope to transfer into a WooCommerce theme. What do you think of the first prototype? I know the logo isn't transparent and there's no footer yet, but aside from that I'm eager to hear your feedback. The website is here: www.zachtownsend.co.uk/hoxtondesigns Thanks, Zach
-
Website for hand-made macrame jewellery
Hi all, Checkout the coded prototype here: www.zachtownsend.co.uk/soknotty. Let me know what you think and where I can go with it. I can't take credit for coding the image carousel, this was a plugin of someone elses work, styled to suit the page. I would like to get a nice shadow underneath it like the design but couldn't work out how to do that. Anyone got any ideas? Thanks