Κινούμενη εικόνα..

Ερωτήσεις και απαντήσεις σχετικές με την HTML, XHTML και την κατασκευή σελίδων για το Web.

Συντονιστές: WebDev Moderators, Super-Moderators

Απάντηση
Άβαταρ μέλους
oikonomou
Δημοσιεύσεις: 362
Εγγραφή: 23 Φεβ 2006 10:56

Κινούμενη εικόνα..

Δημοσίευση από oikonomou » 22 Ιούλ 2006 19:34

Θέλω να κάνω μια εικόνα να εμφανίζετε πάντα στο μέσο του αριστερού μέρος της σελίδας μου ακόμα και όταν κάνω scroll. Δηλαδή να κινείται και αυτή και πάντα να έρχεται εκεί που θέλω. Το έχω δει σε 1-2 σελίδες αλλά δεν μπορώ να βρω πως γίνετε αυτό με την HTML.

Κάτι βρήκα με το tag iframe αλλα δεν μπορω να βρω λυση.
Ειμαι στον σωστό δρόμο;
Έλεος με γκρίκλις πλέον. Γράψτε ελληνικά

Άβαταρ μέλους
fafos
Script Master
Δημοσιεύσεις: 6230
Εγγραφή: 30 Νοέμ 2004 03:09

Κινούμενη εικόνα..

Δημοσίευση από fafos » 22 Ιούλ 2006 20:21

An enoeis kati tetoio: http://www.debas.cl/

kane ta parakato:

Sose ton parakato kodika javascript se ena arxeio nav.js:

Κώδικας: Επιλογή όλων

var ns = (navigator.appName.indexOf("Netscape") != -1);
var d = document;
function JSFX_FloatDiv(id, sx, sy)
{
	var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
	var px = document.layers ? "" : "px";
	window[id + "_obj"] = el;
	if(d.layers)el.style=el;
	el.cx = el.sx = sx;el.cy = el.sy = sy;
	el.sP=function(x,y){this.style.left=x+px;this.style.top=y+px;};

	el.floatIt=function()
	{
		var pX, pY;
		pX = (this.sx >= 0) ? 0 : ns ? innerWidth : 
		document.documentElement && document.documentElement.clientWidth ? 
		document.documentElement.clientWidth : document.body.clientWidth;
		pY = ns ? pageYOffset : document.documentElement && document.documentElement.scrollTop ? 
		document.documentElement.scrollTop : document.body.scrollTop;
		if&#40;this.sy<0&#41; 
		pY += ns ? innerHeight &#58; document.documentElement && document.documentElement.clientHeight ? 
		document.documentElement.clientHeight &#58; document.body.clientHeight;
		this.cx += &#40;pX + this.sx - this.cx&#41;/8;this.cy += &#40;pY + this.sy - this.cy&#41;/8;
		this.sP&#40;this.cx, this.cy&#41;;
		setTimeout&#40;this.id + "_obj.floatIt&#40;&#41;", 40&#41;;
	&#125;
	return el;
&#125;
JSFX_FloatDiv&#40;"slogan", '-30',20&#41;.floatIt&#40;&#41;;
Vale ton parakato kodika ekei pou thes na ksekina h eikona:

Κώδικας: Επιλογή όλων

<div id="slogan"> 
<script src="nav.js" type="text/javascript" language="javascript"></script>
</div>
kai telos feiakse to style tou div:

Κώδικας: Επιλογή όλων

#slogan	&#123;
	background&#58; url&#40;images/eikona.gif&#41; no-repeat;
	width&#58; 65px;
	height&#58; 68px;
	z-index&#58; 100000;
	position&#58; relative;
	top&#58; 20px;
	visibility&#58; visible;
	overflow&#58; visible;
	float&#58;left;
	margin&#58;0px;
	&#125;
opou eikona.gif h eikona pou thes na scrolarei
Οι πάνες και οι πολιτικοί πρέπει να αλλάζονται συχνά για τον ίδιο λόγο...

Άβαταρ μέλους
oikonomou
Δημοσιεύσεις: 362
Εγγραφή: 23 Φεβ 2006 10:56

Κινούμενη εικόνα..

Δημοσίευση από oikonomou » 23 Ιούλ 2006 01:28

Αυτο ακριβως εννοουσα...μονο που με τον ΙΕ δεν δουλευει το σκριπτ της σελιδας που εδωσες. Με το Mozilla το ειδα. Περιεργο.

Ευχαριστω θα το δοκιμασω αμεσως.
Έλεος με γκρίκλις πλέον. Γράψτε ελληνικά

Άβαταρ μέλους
oikonomou
Δημοσιεύσεις: 362
Εγγραφή: 23 Φεβ 2006 10:56

Κινούμενη εικόνα..

Δημοσίευση από oikonomou » 23 Ιούλ 2006 01:45

Εκανα οπως μου ειπες

Κώδικας: Επιλογή όλων

<HTML>
<HEAD>
<TITLE>τεστ</TITLE>
<style type="text/css">
<!--
#slogan   &#123; 
   background&#58; url&#40;myicon.gif&#41; no-repeat; 
   width&#58; 80px; 
   height&#58; 80px; 
   z-index&#58; 100000; 
   position&#58; relative; 
   top&#58; 20px; 
   visibility&#58; visible; 
   overflow&#58; visible; 
   float&#58;left; 
   margin&#58;0px; 
   &#125;
&#125;
-->
</style>
</HEAD>
<BODY BGCOLOR="#ffffff"><br />
<table>
<tr><td>
<div id="slogan"><a href="index.php" target="_blank">
<script src="nav.js" type="text/javascript" language="javascript"></script></a>
</div>
</td></tr>
<tr><td>
<p><br></p><p><br></p><p><br></p><p><br></p><p><br>
</p><p><br></p><p><br></p><p><br></p><p><br></p><p><br>
</p><p><br></p><p><br></p><p><br>

</p><p><br></p><p><br></p><p><br></p><p><br></p><p><br>
</p><p><br></p><p><br></p><p><br></p><p><br></p><p><br>
</p><p><br></p><p><br></p><p>

<br></p><p><br></p><p><br></p><p><br></p><p><br></p><p>
<br></p><p><br></p><p><br></p><p><br></p>
</tr></td>
</table>
</BODY>
</HTML>
αλλα στον ΙΕ δεν δουλευει...μονο στον Mozilla
Επισης δεν μπορω να την κανω λινκ την εικονα κατι που ειναι πολυ βασικο για εμενα.
Έλεος με γκρίκλις πλέον. Γράψτε ελληνικά

zeppos
Δημοσιεύσεις: 431
Εγγραφή: 26 Μαρ 2006 10:43
Τοποθεσία: Kyklades
Επικοινωνία:

Κινούμενη εικόνα..

Δημοσίευση από zeppos » 28 Ιούλ 2006 13:51

Κάτι που δεν είναι δικό μου, το βρήκα έτοιμο.

Κώδικας: Επιλογή όλων

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
window.onerror = null;
var topMargin = 100;
var rightMargin = 700;

var slideTime = 1000;
var ns6 = &#40;!document.all && document.getElementById&#41;;
var ie4 = &#40;document.all&#41;;
var ns4 = &#40;document.layers&#41;;
function layerObject&#40;id,left&#41; &#123;
if &#40;ns6&#41; &#123;
this.obj = document.getElementById&#40;id&#41;.style;
this.obj.left = left;
return this.obj;
&#125;
else if&#40;ie4&#41; &#123;
this.obj = document.all&#91;id&#93;.style;
this.obj.left = left;
return this.obj;
&#125;
else if&#40;ns4&#41; &#123;
this.obj = document.layers&#91;id&#93;;
this.obj.left = left;
return this.obj;
   &#125;
&#125;
function layerSetup&#40;&#41; &#123;
floatLyr = new layerObject&#40;'floatLayer', pageWidth * .5&#41;;
window.setInterval&#40;"main&#40;&#41;", 10&#41;
&#125;
function floatObject&#40;&#41; &#123;
if &#40;ns4 || ns6&#41; &#123;
findHt = window.innerHeight;
&#125; else if&#40;ie4&#41; &#123;
findHt = document.body.clientHeight;
   &#125;
&#125; 
function main&#40;&#41; &#123;
if &#40;ns4&#41; &#123;
this.currentY = document.layers&#91;"floatLayer"&#93;.top;
this.scrollTop = window.pageYOffset;
mainTrigger&#40;&#41;;
&#125;
else if&#40;ns6&#41; &#123;
this.currentY = parseInt&#40;document.getElementById&#40;'floatLayer'&#41;.style.top&#41;;
this.scrollTop = scrollY;
mainTrigger&#40;&#41;;
&#125; else if&#40;ie4&#41; &#123;
this.currentY = floatLayer.style.pixelTop;
this.scrollTop = document.body.scrollTop;
mainTrigger&#40;&#41;;
   &#125;
&#125;
function mainTrigger&#40;&#41; &#123;
var newTargetY = this.scrollTop + this.topMargin;
var newTargetX = this.scrollTop + this.rightMargin;

if &#40; this.currentY != newTargetY &#41; &#123;
if &#40; newTargetY != this.targetY &#41; &#123;
this.targetY = newTargetY;
this.targetX = newTargetX;

floatStart&#40;&#41;;
&#125;
animator&#40;&#41;;
   &#125;
&#125;
function floatStart&#40;&#41; &#123;
var now = new Date&#40;&#41;;
this.A = this.targetY - this.currentY;
this.B = Math.PI / &#40; 2 * this.slideTime &#41;;
this.C = now.getTime&#40;&#41;;
if &#40;Math.abs&#40;this.A&#41; > this.findHt&#41; &#123;
this.D = this.A > 0 ? this.targetY - this.findHt &#58; this.targetY + this.findHt;
this.A = this.A > 0 ? this.findHt &#58; -this.findHt;
&#125;
else &#123;
this.D = this.currentY;
   &#125;
&#125;
function animator&#40;&#41; &#123;
var now = new Date&#40;&#41;;
var newY = this.A * Math.sin&#40; this.B * &#40; now.getTime&#40;&#41; - this.C &#41; &#41; + this.D;
newY = Math.round&#40;newY&#41;;
if &#40;&#40; this.A > 0 && newY > this.currentY &#41; || &#40; this.A < 0 && newY < this.currentY &#41;&#41; &#123;
if &#40; ie4 &#41;document.all.floatLayer.style.pixelTop = newY;
if &#40; ns4 &#41;document.layers&#91;"floatLayer"&#93;.top = newY;
if &#40; ns6 &#41;document.getElementById&#40;'floatLayer'&#41;.style.top = newY + "px";
   &#125;
&#125;
function start&#40;&#41; &#123;
if&#40;ns6||ns4&#41; &#123;
pageWidth = innerWidth;
pageHeight = innerHeight;
layerSetup&#40;&#41;;
floatObject&#40;&#41;;
&#125;
else if&#40;ie4&#41; &#123;
pageWidth = document.body.clientWidth;
pageHeight = document.body.clientHeight;
layerSetup&#40;&#41;;
floatObject&#40;&#41;;
   &#125;
&#125;
//  End -->
</script>
Το πιο πάνω στο head και στο body

Κώδικας: Επιλογή όλων

<body  onLoad="start&#40;&#41;" >
Και από κάτω

Κώδικας: Επιλογή όλων

<DIV id="floatLayer" style="position&#58; absolute; height&#58;213px; width&#58;135px; left&#58;100px; top&#58;30px;z-index&#58; 100"><a href="#">Την εικόνα σου εδώ!</a></DIV>

Απάντηση

Επιστροφή στο “HTML και XHTML”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 0 επισκέπτες