Dhtml - Occhio di bue

Home Page

Occhio di bue

Sfumatura su sfondo nero di un'immagine con relative zone di ombra e di luce.

il codice da inserire nella tua pagina

<style>
<!--

#spotlight{
filter:light
}

-->
</style>

</HEAD>

<script type="text/javascript" src="https://i5.plug.it/cmp/iub_conf_libero.js"></script>
    <script type="text/javascript" src="//cdn.iubenda.com/cs/tcf/stub-v2.js"></script>
    <script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>
    
    
    <script src='https://i5.plug.it/cmp/qciol.min.js' async="true"></script>
	
	
<script src="//barra-spazio.libero.it/x/js/barra_n04_siti.js?ver=1" type="text/javascript" language="Javascript"></script>

Libero.Stash.HF = { version: '8.3.04', cksrv: { a: 'HF8.3.04', b: 'digilander' } };

</script>

<!--[if lte IE 7]>
	<style>
	#lh_header_top #HF_login_l, #lh_header_top #HF_login_r { 
		float: none;
	}
	#lh_header_top {
		left: 0px;
	}
	
	#l_header_topbar #l_header_topbar_popup_altro, #l_header_topbar #l_header_topbar_popup_opzioni {
    	margin-top: 33px;
	}
	#l_header_topbar #l_header_topbar_popup_nicknames {
    	margin-top: 25px;
	}

</style>
<![endif]-->
<style>
	#lh_header #lh_area02a{
		position:relative;
		overflow: visible;
		height: 30px;
	}
	
	#lh_header #lh_area02b{
		z-index: -1;
	}
	#lh_header #lh_area02a .lh_pos {
		position: absolute;
		margin-bottom: 0;
	}
	
	#lh_header #lh_area02a .lh_on {
	}
	#lh_header .lh_finput_area input {
		height: 27px;
		padding-top: 0;
		padding-bottom: 0;
		line-height: 27px !important;
		font-size: 15px !important;
	}
	#lh_altro{
		position: relative !important;
	}
	#lh_header_top .lh_popup {
	}
	#lf_footer .lf_finput_area input {
		font-size: 12px !important;
		line-height: 25px !important;
		vertical-align: middle;
		padding: 0 !important;
		margin: 0 !important;
	}
	
</style>

// Run on load
	Libero.HF.adjust800(Libero.Stash.extractSummary);
	
	// Add onresize handlers 
	if ( window.addEventListener ) {
		window.addEventListener('resize', function() { Libero.HF.adjust800(Libero.Stash.extractSummary) }, 1);
	} 
	else if (window.attachEvent) {
		window.attachEvent('onresize', function() { Libero.HF.adjust800(Libero.Stash.extractSummary) });
	}
-->
</script>

<link rel="preconnect" href="https://tags.crwdcntrl.net">         
<link rel="preconnect" href="https://bcp.crwdcntrl.net">         
<link rel="dns-prefetch" href="https://tags.crwdcntrl.net">         
<link rel="dns-prefetch" href="https://bcp.crwdcntrl.net">
<script type='text/javascript' src='https://www.iolam.it/js/iam2.0.js?ns=libero/web/community/siti/1.2' async></script>

<div id="ad72890top" align="center"></div>

<div id="ad72890bottom" align="center"></div> 

<SCRIPT LANGUAGE="Javascript">

</SCRIPT>
<SCRIPT LANGUAGE="Javascript" SRC="http://digilander.libero.it/_ad/digi_ad_13.js">
</SCRIPT>

<script>
if(window.location === window.parent.location){    
  // Static Queue Snippet
  ! function(t, n) {
      t[n] = t[n] || {
          nlsQ: function(e, o, c, r, s, i) {
              return s = t.document, r = s.createElement("script"), r.async = 1, r.src =
                  ("http:" === t.location.protocol ? "http:" : "https:") + "//cdn-gl.imrworldwide.com/conf/" +
                  e + ".js#name=" + o + "&ns=" + n, i = s.getElementsByTagName("script")[0],
                  i.parentNode.insertBefore(r, i), t[n][o] = t[n][o] || {
                      g: c || {},
                      ggPM: function(e, c, r, s, i) {
                          (t[n][o].q = t[n][o].q || []).push([e, c, r, s, i])
                      }
                  }, t[n][o]}}}
  (window, "NOLBUNDLE");

// SDK Initialization
  var nSdkInstance = NOLBUNDLE.nlsQ("P1504C48C-9D0B-4ADE-B7CD-04AF56A52362", "nlsnInstance");
  // Content Metadata 
  var nielsenMetadata = {
      type: 'static', 
      assetid: (  location.hostname + location.pathname + location.search ).replace( /([^\w]|_)+/g, '-' ).replace( /^-+|-+$/g, '' ) || 'homepage',
      section: 'LiberoCommunity_BRW' 
  };

// Event 'staticstart' Call
  nSdkInstance.ggPM("staticstart", nielsenMetadata);    
}
</script>

<script type="text/javascript">
if ( rs_DLRERR == 1 ) {
var libero_comscore_error = 404;
}
</script>
<script type="text/javascript">
	document.write(unescape("%3Cscript src='" + (document.location.protocol == "https:" ? "https://sb" : "http://b") + ".scorecardresearch.com/beacon.js'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
if (rs_DLR) {
	document.write(unescape("%3Cscript id='libero_tracking_js_site' src='http://digistatic.libero.it/js/comscore_8_3_04/comscore_digilander.libero.it.js'%3E%3C/script%3E"));
	document.write(unescape("%3Cscript id='libero_tracking_js_site' src='http://digistatic.libero.it/js/comscore_8_3_04/comscore_engine.js'%3E%3C/script%3E"));
	
}
</script>
<noscript>
	<img src="http://b.scorecardresearch.com/p?c1=2&c2=13259779&cj=1&name=libero.others&ns_site=libero" />	
</noscript>

<script src="//i.plug.it/iplug/js/lib/iol/analytics/data/digilander-libero-it/tracking_digilander-libero-it.min.js"></script>
<script src="//i.plug.it/iplug/js/lib/iol/analytics/engine/IOL.Analytics.Tracking.min.js"></script>
<script type="text/javascript">
var iat = new IOL.Analytics.Tracking.Engine();
iat.send();
</script>
<noscript><img src="//italiaonline01.wt-eu02.net/215973748390194/wt.pl?p=315,libero.web.share.digiland.siti.digilander&cg1=libero&cg2=web&cg3=share&cg4=digiland&cg5=siti&cg6=digilander&cg7=libero.web.share.digiland.siti.digilander" height="1" width="1" alt=""></noscript>

<script async src="https://www.googletagmanager.com/gtag/js?id=G-9K5Y6YYGV4"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-9K5Y6YYGV4');
</script>

if (document.all&&window.spotlight){
var x=new Array()
var direction=new Array()
var y=new Array()
if (spotlight.length==null){
spotlight[0]=document.all.spotlight
x[0]=0
direction[0]="right"
y[0]=spotlight[0].height
spotlight[0].filters.light.addPoint(100,50,100,255,255,255,90)
}
else
for (i=0;i<spotlight.length;i++){
x[i]=0
direction[i]="right"
y[i]=spotlight[i].height
spotlight[i].filters.light.addPoint(100,50,100,255,255,255,90)
}
}

function slidelight(cur){
spotlight[cur].filters.light.MoveLight(0,x[cur],y[cur],200,-1)

if (x[cur]<spotlight[cur].width+200&&direction[cur]=="right")
x[cur]+=10
else if (x[cur]>spotlight[cur].width+200){
direction[cur]="left"
x[cur]-=10
}
else if (x[cur]>-200&&x[cur]<-185){
direction[cur]="right"
x[cur]+=10
}
else{
x[cur]-=10
direction[cur]="left"
}
}

if (document.all&&window.spotlight){
if (spotlight.length==null)
setInterval("slidelight(0)",spotlight[0].speed)
else
for (t=0;t<spotlight.length;t++){
var temp='setInterval("slidelight('+t+')",'+spotlight[t].speed+')'
eval(temp)
}
}
</script>

</html>

nome_img.gif: modificare immagine.gif con l'immagine su cui si vuole creare l'effetto occhio di bue
speed: indica la velocità con cui la luce si sposterà sulla nostra immagine

Ah, non dimenticate di cambiare l'URL del mio sito con il vostro

**Nella sezione Applet troverete un esempio molto simile a questa demo che vi potrà essere utile: See It!

E' vietata la riproduzione anche solo parziale di immagini, icone, layout e contenuti senza previa autorizzazione.
I marchi, i loghi e i prodotti citati sono dei legittimi proprietari.