It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center.
Closed 10 years ago.
How easy is it to animate 5 pictures/photos?
E.g. http://artyougrewupwith.com/
What's the best language(s) to use to do this effect?
Regards
Tea
You could either do an animated gif (which is rather old technology), or you could javascript to set a timer to switch the image sources. I would recommend using javascript code. Here is a sample:
var i=0;
var imageSrcs=['image1.png','image3.png','image3.png','image4.png','image5.png'];
var imageElement=document.getElementById('imageToAnimate');
setInterval(
function(){
imageElement.src=imageSrcs[i];
i=(i+1)%(imageSrcs.length+1);
},1000)//Every 1000 milliseconds
This will cycle through the images in the array at a rate of 1/sec and will repeat once it reaches the end.
There are at least two ways to do this (not counting Flash):
JavaScript:
Probably the most common way to do it today would be to use JavaScript. Writing it from scratch on your own might take some time, especially if you are not used to writing JavaScript. However, if you are okay with using a library like jQuery, there are plenty of plugins that does exactly that.
Here is one example:
http://nivo.dev7studios.com/
CSS
With CSS becoming increasingly more powerful through the features added with CSS3, it is also possible to accomplish a slideshow with that. Smashing Magazine has an article on how it can be achieved. Here's an example of what that could look like.
The drawback with this solution is a limited browser support for the new CSS-features.
Related
It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center.
Closed 9 years ago.
Aloha,
Here is the code I want to use for my project.
http://desandro.github.com/3dtransforms/examples/carousel-02-dynamic.html
3D transforms by DeSandro.
My task is to make it close to fullscreen (for example for 1024x768 like 900x700) and make it resnponsive.
Questions would be:
1) Can it be done with bootstrap? I tried Bootstrap container/row/span but all of them just screw everything.
2) http://css-tricks.com/snippets/css/media-queries-for-standard-devices/ I found this media queries. Are they enough for make it responsive? or there is never enough?
i tried to copy code to http://jsfiddle.net/ but it doesnot work there I guess
I think from your description its clear that you want a Jquery 3d responsive carousel...
So why using with bootstrap its of no use... Just attach a jquery plugin for your requirement..
Check out this plugin...
http://coolcarousels.frebsite.nl/c/51/
The responsive part here can be done by the use of media queries and their are many examples too you can choose from it...
It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center.
Closed 10 years ago.
I am looking to implement a card based game (much like yu-gi-oh) of Game of Thrones. I am not new to programming I have a good level in Java, C, C++, but I am fairly new to html and its libraries. I wanted to know if anyone could give me some advises on which libraries or methods should I use.
I will need to be able to:
Have a large data base.
Make little animations, just little translations and rotations of an image.
Add personalized buttons and other menu items.
Duels between players and multiplayer to 5 persons.
I Thank you in advance.
For database you should use PHP + MySQL.
For animations use javascript with jquery library,HTML5,CSS3.
Personalized buttons,other menu items probably CSS-CSS3
Duels between players and multiplayer to 5 persons,umm probably use NodeJS,but it can be done in PHP+Ajax.
Or you can write it in Java,and embed it into a website.
Check Drakensang online,written in Java ,embededd into a website.
Good website for learning web development: http://www.w3schools.com/
Ajax: http://www.w3schools.com/ajax/ajax_intro.asp
Jquery: jquery.com/
PHP: php.net/manual/en/index.php
NodeJS: nodejs.org/
MySQL: www.mysql.com/
Just use html5 and you will be fine. If you need more then jquery is probably useful.
In more detail:
little animations, translations and rotation: rotate image
personalized buttons: normal grafic or css
for multiplayer, you probably need sockets too. Those are also supported in html5.
It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center.
Closed 10 years ago.
Is it possible to create a countdown timer using purely HTML?
I mean no javascript or iframe or external CSS. just basic HTML and embedded style sttributes - i.e. <h1 style="CSS GOES HERE">TEXT GOES HERE</h1>.
Is this possible?
if so, how?
You could use an animated gif.
The html would look like this.
<img src="countdown.gif" alt="countdown">
where countdown.gif is a reference to your countdown image.
Actually creating the image is left as an exercise to the reader.
You may be able to cobble something together using a <meta http-equiv="refresh" tag and some static pages.
No. HTML is a mark-up language, not a script language. Mark-up languages are static, you can set them once. If you need interaction, you need a client-side script language like JavaScript.
Side Note
It is possible with only CSS3 animations: http://codepen.io/WouterJ/details/brguf
But be aware that CSS3 is not stable yet and the CSS3 animation API is far from stable. More information on canIUse
In short, no. HTML is completely static unless you use something such as javascript to make it dynamic.
As #SLaks suggested though it is possible using CSS3 animations but this will not be supported in older browsers.
It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center.
Closed 10 years ago.
I saw this great dynamic image website which got me curious on actual development. My plan is to create a friendly more dynamic animation on the left and right margin of the browser giving it more flavor or life. I am a complete beginner but I am willing to learn. So what would I need to create animations like as seen on link and are there any good tutorials to do this.
You can write raw code for HTML5 canvas or alternatively use a third party app like Adobe Edge.
http://labs.adobe.com/technologies/edge/
Also check out CSS3 animations
http://webdesignerwall.com/trends/47-amazing-css3-animation-demos
Or a Javascript animation library like Alice.js
http://blackberry.github.com/Alice/
What you want to learn is HTML5 with Canvas.
Essentially W3 is trying to replace flash with this feature.
It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center.
Closed 9 years ago.
I am new to HTML5.I see lot of charts using sencha,fusion.Is it possible drawing charts without using any scripts in HTML5?Have they used scripts?If it is possible only through scripts,why should we use HTML5? is Normal HTML Enough?
HTML5 has something called canvas that can show beautiful charts like this.
Now, do draw a chart, we need data primarily. That is xml, json or javascript array or something like that. HTML5 is just the latest version of HTML which makes it a Markup Language.
HTML just can render graphs into the screen once your script supply it all your data.
The point is, HTML5 cannot parse your custom data. And also to make it compatible to our good old IE, who apparently have not heard of canvas yet, , we need libraries like explorercanvas.
And to make this drawing simpler and cross browser friendly, we use libraries like
Raphaël
RGraph
if you want performance and beauty you have this - http://www.highcharts.com
thanks