Skip to main content

HTML 5 - efecte vizuale uimitoare

Se pare ca zilele in care se folosea Photoshop la greu pentru a crea efecte pe paginile HTML incep sa apuna. Java Script impreuna cu HTML 5 ofera posibilitatea de a face efecte vizuale pe care acu 2-3 ani doar le puteam visa.
Hai sa va dau si un exemplu: http://www.nevermindthebullets.com/
Este un site de benzi desenate. Nimic deosebit pana acuma. Dar daca ne uitam in codul HTML o sa observam ca foarte multe efecte vizuale la imagini sunt facute prin intermediul la Java Script.
Cum s-a ajuns la aceasta performanta? S-a inceput de la niste imagini in format PNG, care pot sa fie transparente sau "decupate". Prin acest mecanism se permite suprapunerea de imagini ca si in Photoshop( layer). Fiecare element din imagine este o imagine separata. Dar pe langa atributele normale care le putem gasi pentru tagurile HTML precum img sau p o sa observat niste atribute noi precum: cp:x, cp:ballon sau cp:text. Aceste atribute custom, prefixate cu cp pe care le-a introdus creatorul sitului nu sunt procesate de catre brower deoare nu sunt valide. Dar reprezinta un mod inedit de a pastra meta-date precum pozitie pe o anumita axa, fond type, efectul care sa existe pe tagul respectiv.
<p class="Balloon" cp:text="Little" cp:balloon="Tell" style="left: 74px; top: 35px; width: 280px; position: absolute">
He's come to the west; the land of opportunity.
</p>
<img class="Layer" style="left:-444px; top:-75px" src="soif-2.png" cp:y="100" cp:x="600" />

Dar fiecare din aceste atribute sunt prelucrate de catre Java Script care adauga anumite efecte speciale. Toate aceste efecte speciale le puteti gasii in parallax.js.
Daca vreti sa aflati mai multe puteti sa intrati aici.

Comments

Popular posts from this blog

Why Database Modernization Matters for AI

  When companies transition to the cloud, they typically begin with applications and virtual machines, which is often the easier part of the process. The actual complexity arises later when databases are moved. To save time and effort, cloud adoption is more of a cloud migration in an IaaS manner, fulfilling current, but not future needs. Even organisations that are already in the cloud find that their databases, although “migrated,” are not genuinely modernised. This disparity becomes particularly evident when they begin to explore AI technologies. Understanding Modernisation Beyond Migration Database modernisation is distinct from merely relocating an outdated database to Azure. It's about making your data layer ready for future needs, like automation, real-time analytics, and AI capabilities. AI needs high throughput, which can be achieved using native DB cloud capabilities. When your database runs in a traditional setup (even hosted in the cloud), in that case, you will enc...

Cloud Myths: Migrating to the cloud is quick and easy (Pill 2 of 5 / Cloud Pills)

The idea that migration to the cloud is simple, straightforward and rapid is a wrong assumption. It’s a common misconception of business stakeholders that generates delays, budget overruns and technical dept. A migration requires laborious planning, technical expertise and a rigorous process.  Migrations, especially cloud migrations, are not one-size-fits-all journeys. One of the most critical steps is under evaluation, under budget and under consideration. The evaluation phase, where existing infrastructure, applications, database, network and the end-to-end estate are evaluated and mapped to a cloud strategy, is crucial to ensure the success of cloud migration. Additional factors such as security, compliance, and system dependencies increase the complexity of cloud migration.  A misconception regarding lift-and-shits is that they are fast and cheap. Moving applications to the cloud without changes does not provide the capability to optimise costs and performance, leading to ...

Cloud Myths: Cloud is Cheaper (Pill 1 of 5 / Cloud Pills)

Cloud Myths: Cloud is Cheaper (Pill 1 of 5 / Cloud Pills) The idea that moving to the cloud reduces the costs is a common misconception. The cloud infrastructure provides flexibility, scalability, and better CAPEX, but it does not guarantee lower costs without proper optimisation and management of the cloud services and infrastructure. Idle and unused resources, overprovisioning, oversize databases, and unnecessary data transfer can increase running costs. The regional pricing mode, multi-cloud complexity, and cost variety add extra complexity to the cost function. Cloud adoption without a cost governance strategy can result in unexpected expenses. Improper usage, combined with a pay-as-you-go model, can result in a nightmare for business stakeholders who cannot track and manage the monthly costs. Cloud-native services such as AI services, managed databases, and analytics platforms are powerful, provide out-of-the-shelve capabilities, and increase business agility and innovation. H...