le formule magiche

Risorse pratiche per webmaster,
webdesigner e sviluppatori di siti web

Raccolta di soluzioni, funzionalità e risorse rigorosamente selezionate e utili per la creazione e la gestione dei siti web.
Passare il mouse sui titoli in inglese nel sommario per visualizzare la traduzione in italiano.

Indice generale

Animations

Animazioni
Summary:
  • Animations generator

  • Onmouseover animations

    • Onmouseover animations gallery

    • Zoom effects

    • Filter effects

    • Change image onmouseover

  • Automatic animations

    • Animated titles

    • Scrolling text

    • Images sequence with fade

    • Ken-burns effect (zoom)

    • Flowing light

  • Rotations (automatic and onmouseover)

    • Various rotations

    • Rotating images

    • Swinging card

  • Scroll animations

Background

Summary:
  • Backgrounds created using style rules

  • Background image with centered title

  • Background image with text

  • Positioning a background image

  • Animated background

    • Background image changing with centered title

    • Background image changing with text

    • Background image changing onmouseover with centered title

    • Background changing with centered title

    • Background animated gradient with centered title

    • Disappearing background image

    • Scrolling background

Time and calendars

Data, ora e calendari
Summary:
  • Date and time

    • Date and time various solutions

  • Calendars

    • Events calendar

  • Other

    • Countdown

Captions

Didascalie
Summary:
  • Fixed captions

    • Simple fixed captions

  • Animated captions onmouseover

    • Various effects captions

    • Different directions captions

    • Card captions

Forms (moduli)

Summary:
  • Contact forms

    • Simple contact forms

    • Complete contact form

    • Contact form with attachment

    • Contact form with attachment and storage

    • Multistep contact form

    • Contact form in pop-in

    • Booking form

  • Login forms

    • Simple login form

  • Comments form

    • Simple comments form

    • Advanced comments form

  • Other

    • Anonymous survey form

    • Drag and drop images with folder storage

  • Usefull solutions

    • Registration form

    • Internal search engine

    • Anonymous reporting button

    • Click on link notification

    • Click counter

    • Click on image counter

    • Click on audio image counter

    • Textarea with save as html/txt functionality

    • Textarea character counter

    • Reset textarea

    • Checkboxes + textarea copy and delete

    • Checkboxes select all

    • Checkboxes reset all

    • Checkbox dropdown

    • Option select with notification

    • Submit button with background image

    • Prevent browser autocompilation

    • Preserve compiled fields

    • Preserve selected checkboxes

    • Exclude specific words in input fields (PHP)

    • Show password button

    • Activate / deactivate button

    • Mobile Safari - force style settings for form input fields

Galleries

Gallerie
Summary:
  • Equal size image gallery

  • Equal size image gallery with lightbox

  • Different size image gallery

  • Different size image gallery with lightbox

  • Different height image gallery

  • Different height image gallery with lightbox

  • Self-filling different size image gallery

  • Image gallery with lightbox + video mp4 + video youtube

  • Folder images gallery with lightbox

Slideshow

Summary:
  • Manual slideshow with fade

  • Manual slideshow with video

  • Automatic slideshow with animations

  • Automatic slideshow with pause/play

  • Automatic slideshow with thumbnails

  • Automatic text slideshow

  • Automatic text and image slideshow

  • Automatic crossfade slideshow

  • Automatic staff slideshow

  • Automatic continuous carousel 1

  • Automatic continuous carousel 2

  • Advanced external slideshows recommended

Modal windows - lightbox - pop-in

Finestre modali
Summary:

Tabs

Summary:
  • Simple Tabs

  • Custom Tabs

  • Multiple rooms Tabs

  • Image galleries tabs

Online selling

Vendita online
Summary:
  • Shop window products for sale via PayPal

  • Products for sale box

  • Single product for sale

  • Total price calculator

Menu

Summary:

Footer

Summary:
  • Three columns footer - logo, links, data, social

  • Two columns footer - logo, links, social, form

  • Two columns footer - links, search box

  • Two columns footer - links, social

Layouts HTML5

Summary:
  • Classic HTML5 layout

  • Two columns HTML5 layout

  • Three columns HTML5 layout

  • Full page HTML5 layout

  • Sidebar HTML5 layout

  • Simple HTML5 parallax layout

  • Advanced HTML5 paralax layout

  • Special files (.htaccess, robots.txt, sitemap.xml)

Page structure and functionality

Pagine-struttura-funzionalità
Summary:
  • Various boxes

    • Various boxes count

    • Various boxes grid

    • Various boxes flex

    • Various boxes flex card

  • Tag cloud

  • Fixed elements right, left, bottom

  • Preload

    • Preload 1 theater curtain

    • Preload 2 fade

    • Preload 3 curtain

    • Preload 4 roll

    • Preload animations

  • Redirect

  • Scroll to top

  • Web page titles summary

  • Web page watermark

  • Inclined div

    • Div with inclined horizontal sides

    • Div with inclined vertical sides

  • Magnifying glass

  • Tooltip onclick

  • Random images

  • Expandable text

    • Expandable text

    • Expandable text with checkbox

Graphics

Grafica
Summary:
  • Box-shadow

    • Box-shadow generator

    • Box-shadow 3D effects

  • Text-shadow

    • Text-shadow generator

    • Text-shadow 3D effects

  • Title with background image

    • Text-fill-color method

    • Mix-blend-mode method

  • Clip-path

    • Clip-path generator

    • Clip-path effects

    • Clip-path animation gallery

  • Mask-image

    • Mask-image effects

  • Transform perspective

    • Transform perspective effects

  • Gradients

    • Gradient generator 2 colors

    • Gradient generator 3 colors

    • Gradient animation1

    • Gradient animation2

  • Post-it

    • Classic Post-it

    • Transform Post-it

    • Transform rotate Post-it

  • Various effects

    • Overlapping images

    • Opaque title over semi-transparent image

Video

Summary:
  • MP4 video player with lightbox

  • Youtube video player with lightbox

  • All video type player

  • Video with overlay image

  • Video background with text

  • Video background round

Various resources

Risorse varie
Summary:
  • Fonts

    • Various fonts gallery

  • SVG icon sprite

    • SVG icon sprite pack

    • SVG icon sprite social with jQuery code for global url

  • Pinterest

    • Pin-it icon over image

  • External link icon

    • SVG image

    • PNG image

  • Maps

    • Responsive async map

  • Cookie Law

    • Script per la gestione dei cookie secondo la normativa italiana

  • Google Search engine for website

    • Website Google Search engine + results page

  • Summary

    • Web page titles summary

  • Watermark

    • Web page watermark

HTML solutions

Soluzioni HTML
(member only)
Summary:
  • Body - deactivation of user functions

  • Open all the page links in a new tab

  • Button that opens a alert window

  • Expandable content

  • Clickable phone number

  • Link with error in file manager

  • New line in tooltip

  • Titles in a list

  • Color picker

    • Classic color-picker

    • Open color picker on click

CSS solutions

Soluzioni CSS
(member only)
Sommario:
  • Page height 100%

  • Fix lateral swing on mobile

  • Scrolling div padding solution

  • Distance a list from a float image

  • Continue with the text below a float image

  • Prevent two words breack

  • Center an element in a fixed or absolute position in its container

  • Inclined text or element

  • Inclined div with not inclined text

  • Underlined text onmouseover

  • Transparency and opacity

  • Expandable text

  • Highlighted Text

  • Highlight content on click

  • Active link color

  • Horizontal line (hr) style

  • Horizontal list with vertical dividing lines

  • Parent and child element with onmouseover effect

  • Deactivate animations

  • Remove white space under the images in a div

  • Mobile Safari - background-image

  • Mobile Safari - fix text size

  • Mobile Safari - activate scroll

  • Cursor types

  • Special web colors

Javascript solutions

Soluzioni Javascript, jQuery, PHP
(member only)
Sommario:
  • New line in javascript

  • Multiple functions in singol onclick

  • Adblock redirect scrip

  • Adjust Iframes script

  • Change page color

  • Script to display the current year

  • Signature protection script

  • Return to previous page on click

  • Redirect with countdown

  • Download + redirect

  • Date of the last page update

  • Refresh page button

  • Button to activate web push notifications

  • Copy text on click

  • Export content as HTML

  • Disable right button, dragging and selecting content

  • Disable right button on images

  • Disable body scroll when a popup with active scroll is open

  • Exclude functions according to the screen size

  • Change image after a defined time

  • Prevent page images caching

  • Show all images in a folder

  • Play all videos in a folder

Argomenti del sito utili ai webmaster: