Hacker News new | past | comments | ask | show | jobs | submit login
Game made using only CSS (asiajin.com)
76 points by pwim on May 25, 2011 | hide | past | favorite | 18 comments



It's good to see something that is advertised as 'only CSS' or 'pure CSS' that is actually pure CSS and doesn't have any javascript.



There are a lot of non-English news there. Without translation, it had not been noticed for about a month for example.


Based on the source, it's kind of clever. Each "cow" and "haystack" are a pair of radio buttons, so clicking on the cow toggles the select state for both simultaneously. This combines with some fancy CSS animation to make the cows fly around so they're harder to click.


Does this mean the sequence isn't random? Or is there a CSS trick for randomizing?


I still don't get how the counter is incremented.


The counter is a large image with every possible score (http://ndruger.lolipop.jp//hatena/20110429/css_game/images/c...). Initially only the top of the image is shown, but as the radio buttons are clicked it makes visible some spacing elements which move the image so the next score is shown.


I see. So each input is being made visible in sequence and the overflow outside of #counter is hidden.



More pure CSS minigames can be seen at http://www.cssplay.co.uk/menu/ , under Puzzles.



The problem of programming a game based on :hover states is that you can cheat the game by using a context menu to pass through the walls.


Clever. Does this count as CSS being turing complete yet?


Somebody implemented Rule 110 with CSS and HTML, so I guess it is. See http://news.ycombinator.com/item?id=2300836


As the discussion from that thread concluded, it all comes down to how you define "turing completeness" with respect to the status of turing machines as necessarily abstract constructs, what with their requirement of infinite time/space. It also depends how you view the need for human interaction to drive computation as being relevant to the definition.

Neither of these things were really central ideas in turing's original work, so its kinda open to interpretation.


Can you use CSS to throw your browser into an infinite loop?


I've seen this, in situations where a link is set to become bold when the mouse pointer is hovering over it. The result is that the text becomes bold, and redistributes itself. Having redistributed itself, the bold link is no longer under your mouse pointer, so the link shrinks back to normal font weight. Now the link is back under your mouse pointer so it becomes bold again. Repeat.


A Turing complete machine can require a manual intervention for each step. But yes, if you keep clicking an infinite number of times it can be.




Consider applying for YC's Spring batch! Applications are open till Feb 11.

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: