Pop-Up images

Κώδικας, πληροφορίες, ερωτήσεις και απαντήσεις σχετικές με την JavaScript.

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

Απάντηση
Άβαταρ μέλους
guesswho
Honorary Member
Δημοσιεύσεις: 621
Εγγραφή: 04 Ιαν 2004 02:49
Τοποθεσία: Βόλος-Αθήνα Πάντα ήθελα να το χω δίπορτο...
Επικοινωνία:

Pop-Up images

Δημοσίευση από guesswho » 10 Ιουν 2004 04:26

Ένα όμορφο tutorial για να φτιάξετε απλά και εύκολα thumbnails εικόνων που ανοίγουν σε νέο παράθυρο που έχει τις διαστάσεις της εικόνας.

Βήμα Πρώτο

Βάλτε τον παρακάτω κώδικα μέσα στο <HEAD> της σελίδας σας

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

<!--BEGIN Pop-up Images Script------------------------------------------->
<SCRIPT Language="JavaScript">
<!--
// Copyright 1999 - 2002 by Ray Stott, Pop-up Images Script ver 2.0
// OK to use if this copyright is included
// Script is available at http&#58;//www.crays.com/jsc

var pic = null
var popImg = null  // use this when referring to pop-up image
var picTitle = null
var imgCount = 0
var imgWinName = "popImg"

function openPopImg&#40;picName, windowTitle, windowWidth, windowHeight&#41;&#123;
  closePopImg&#40;&#41;
  picTitle = windowTitle
  imgWinName = "popImg" + imgCount++ //unique name for each pop-up window
  popImg = window.open&#40;picName, imgWinName,
           "toolbar=no,scrollbars=no,resizable=no,width=" 
           + &#40;parseInt&#40;windowWidth&#41;+20&#41;  + ",height=" 
           + &#40;parseInt&#40;windowHeight&#41;+15&#41;&#41; 
  &#125;
function closePopImg&#40;&#41;&#123;    // close pop-up window if it is open 
  if &#40;navigator.appName != "Microsoft Internet Explorer" 
      || parseInt&#40;navigator.appVersion&#41; >=4&#41; //do not close if early IE
    if&#40;popImg != null&#41; if&#40;!popImg.closed&#41; popImg.close&#40;&#41; 
  &#125;
function setStatus&#40;msg&#41;&#123;
  status = msg
  return true
  &#125;
//-->
</SCRIPT>

<SCRIPT Language="JavaScript1.1">  
<!--
// for Netscape 3+ and IE 4+
var priorPic = new Array&#40;&#41;
var noPic = 0
var foundit = false

function openPopImg&#40;picName,  windowTitle, windowWidth, windowHeight&#41;&#123;
  var i = 0
  if&#40;pic == picName && winOpen&#40;&#41;&#41;&#123;
    popImg.focus&#40;&#41;
    &#125;
  else&#123;
    foundit = false
    for&#40;i=0; i<=noPic; i++&#41;&#123;
      if &#40;priorPic&#91;i&#93; == picName&#41;
        foundit = true 
      &#125;
    pic = picName
    closePopImg&#40;&#41;
    picTitle = windowTitle
    imgWinName = "popImg" + imgCount++ //unique name for each pop-up window
    if&#40;!foundit&#41;&#123;
      priorPic&#91;noPic++&#93; = pic
      &#125;
    popImg = openPopImgWin&#40;imgWinName, windowWidth, windowHeight&#41;
    &#125;
  &#125;
function openPopImgWin&#40;imgWinName, windowWidth, windowHeight&#41;&#123;
  var winFeatures = "toolbar=no,scrollbars=no,resizable=no,width=" 
    + windowWidth + ",height=" + windowHeight
  return window.open&#40;"pimg.htm", imgWinName, winFeatures&#41;
  &#125;
function winOpen&#40;&#41;&#123;
  if&#40;popImg != null&#41;&#123; 
    if&#40;popImg.closed != true&#41; return true; else return false
    &#125;  
  else
    return false
  &#125;
//-->
</SCRIPT>

<SCRIPT Language="JavaScript1.2"> 
<!--
// Use this function to control placement of pop-up window
// in Netscape 4+ and Internet Explorer 4+
function openPopImgWin&#40;imgWinName, windowWidth, windowHeight&#41;&#123;
  var leftX = 20  // distance of window's left side from left of screen
  var topY = 20   // distance of window's top side from top of screen
  var winFeatures = "toolbar=no,scrollbars=no,resizable=no,width=" 
    + windowWidth + ",height=" + windowHeight
  if &#40;leftX>0&#41;&#123;
    winFeatures += ",screenX=" + leftX + ",left=" + leftX	
                + ",screenY=" + topY + ",top=" + topY
    &#125;
  return window.open&#40;"pimg.htm", imgWinName, winFeatures&#41;
  &#125;
//-->
</SCRIPT>
<!--END Pop-up Images Script-------------------------------------------->
Βήμα Δεύτερο

Μέσα στο <BODY> βάζουμε τον παρακάτω κώδικα

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

onUnload="closePopImg&#40;&#41;"
παράδειγμα:
<BODY onUnload="closePopImg()">
Βήμα Τρίτο

Για κάθε νέα εικόνα βάλτε το κώδικα μέσα σε ένα ξεχωριστό κελί για κάθε εικόνα.

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

<A HREF="JAVASCRIPT&#58;openPopImg&#40;picName, windowTitle, windowWidth, windowHeight&#41;" 
     onMouseOver="return setStatus&#40;'Click to display picture.'&#41;"
     onMouseOut="return setStatus&#40;''&#41;">
     <IMG SRC=name_of_thumbnail_file ALT=alt_text></A>
παράδειγμα αλλαγής τιμών:
<A HREF="JAVASCRIPT:openPopImg('anthony.jpg', 'Anthony', '226', '221')"
onMouseOver="return setStatus('Click to display picture.')"
onMouseOut="return setStatus('')">
<img src="anthonyi.jpg" alt="Anthony"></A>
Βήμα Τέταρτο

Κάντε μια νέα σελίδα,ο κωδικός της σελίδας να είναι αυτός

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

<HTML>
<HEAD>
<!--
This code is part of a Pop-up image Script that is
available at http&#58;//www.crays.com/jsc
--->
<TITLE>Loading</TITLE>
<SCRIPT Language="JavaScript">
<!--
function fabricatePage&#40;&#41;&#123;
  var htmlStr = 
    '<HTML><HEAD><TITLE>' + window.opener.picTitle + '</TITLE></HEAD>'
  + '<BODY background="' + window.opener.pic + '"></BODY></HTML>'
  document.open&#40;&#41;
  document.write&#40;htmlStr&#41;
  document.close&#40;&#41;
  &#125;
//-->
</SCRIPT>
</HEAD>
<BODY bgcolor="#CCCCCC" onLoad="fabricatePage&#40;&#41;">
<SCRIPT Language="JavaScript">
<!--
  if&#40;!window.opener.foundit&#41;&#123;
    document.write&#40;"Loading Picture...<BR>"&#41;
    document.write&#40;'<img src="' + window.opener.pic + '" width=100% height=80%>'&#41;
    document.close&#40;&#41;
    &#125; 
//-->
</SCRIPT>
</BODY>
</HTML>
Αποθηκευστε αυτή τη σελίδα με το όνομα pimg.htm και βάλτη μεσα στον ίδιο φάκελο με τη σελίδα που έιναι οι εικόνες.

Ελπίζω να βοήθησα κάποιους

Άβαταρ μέλους
EneMe
Super Moderator
Δημοσιεύσεις: 13307
Εγγραφή: 09 Ιούλ 2002 13:29
Τοποθεσία: Στο κέντρο της Ελλάδας!
Επικοινωνία:

Pop-Up images

Δημοσίευση από EneMe » 10 Ιουν 2004 16:28

Μοιάζει αρκετά καλό!

Θα το χρησιμοποιήσω σύντομα!

:) :) :) :) :) :)

Άβαταρ μέλους
ArchangelX
Honorary Member
Δημοσιεύσεις: 2430
Εγγραφή: 24 Μαρ 2004 13:33
Τοποθεσία: 7ος Ουρανός
Επικοινωνία:

Pop-Up images

Δημοσίευση από ArchangelX » 10 Ιουν 2004 16:51

Einai pragmati poly kalo. To xrhsimopoioysa gia poly kairo alla dysthxws einai xronoboro mexri na grapseis kai na ry8miseis thn istoria me ton kwdika.

San alternative, proteinw to ekshs.

Mesa sto Head

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

<script>

// Set the horizontal and vertical position for the popup

PositionX = 5;
PositionY = 5;

// Set these value approximately 20 pixels greater than the
// size of the largest image to be used &#40;needed for Netscape&#41;

defaultWidth  = 600;
defaultHeight = 600;

// Set autoclose true to have the window close automatically
// Set autoclose false to allow multiple popup windows

var AutoClose = true;

// Do not edit below this line...
// ================================
if &#40;parseInt&#40;navigator.appVersion.charAt&#40;0&#41;&#41;>=4&#41;&#123;
var isNN=&#40;navigator.appName=="Netscape"&#41;?1&#58;0;
var isIE=&#40;navigator.appName.indexOf&#40;"Microsoft"&#41;!=-1&#41;?1&#58;0;&#125;
var optNN='scrollbars=no, width='+defaultWidth+', height='+defaultHeight+', left='+PositionX+', top='+PositionY;
var optIE='scrollbars=no, width=150, height=100, left='+PositionX+', top='+PositionY;
function popImage&#40;imageURL,imageTitle&#41;&#123;
if &#40;isNN&#41;&#123;imgWin=window.open&#40;'about&#58;blank','',optNN&#41;;&#125;
if &#40;isIE&#41;&#123;imgWin=window.open&#40;'about&#58;blank','',optIE&#41;;&#125;
with &#40;imgWin.document&#41;&#123;
writeln&#40;'<html><head><title>Loading...</title><style>body&#123;margin&#58;0px;&#125;</style>'&#41;;
writeln&#40;'<sc'+'ript>'&#41;;
writeln&#40;'var isNN,isIE;'&#41;;
writeln&#40;'if &#40;parseInt&#40;navigator.appVersion.charAt&#40;0&#41;&#41;>=4&#41;&#123;'&#41;;
writeln&#40;'isNN=&#40;navigator.appName=="Netscape"&#41;?1&#58;0;'&#41;;
writeln&#40;'isIE=&#40;navigator.appName.indexOf&#40;"Microsoft"&#41;!=-1&#41;?1&#58;0;&#125;'&#41;;
writeln&#40;'function reSizeToImage&#40;&#41;&#123;'&#41;;
writeln&#40;'if &#40;isIE&#41;&#123;'&#41;;
writeln&#40;'window.resizeTo&#40;100,100&#41;;'&#41;;
writeln&#40;'width=100-&#40;document.body.clientWidth-document.images&#91;0&#93;.width&#41;;'&#41;;
writeln&#40;'height=100-&#40;document.body.clientHeight-document.images&#91;0&#93;.height&#41;;'&#41;;
writeln&#40;'window.resizeTo&#40;width,height&#41;;&#125;'&#41;;
writeln&#40;'if &#40;isNN&#41;&#123;'&#41;;       
writeln&#40;'window.innerWidth=document.images&#91;"George"&#93;.width;'&#41;;
writeln&#40;'window.innerHeight=document.images&#91;"George"&#93;.height;&#125;&#125;'&#41;;
writeln&#40;'function doTitle&#40;&#41;&#123;document.title="'+imageTitle+'";&#125;'&#41;;
writeln&#40;'</sc'+'ript>'&#41;;
if &#40;!AutoClose&#41; &#123;
writeln&#40;'</head><body bgcolor=000000 scroll="no" onload="reSizeToImage&#40;&#41;;doTitle&#40;&#41;;self.focus&#40;&#41;">'&#41;;
&#125;
else &#123;
writeln&#40;'</head><body bgcolor=000000 scroll="no" onload="reSizeToImage&#40;&#41;;doTitle&#40;&#41;;self.focus&#40;&#41;"'&#41;;
writeln&#40;' onblur="self.close&#40;&#41;">'&#41;;
&#125;
writeln&#40;'<img name="George" src='+imageURL+' style="display&#58;block"></body></html>'&#41;;
close&#40;&#41;;		
&#125;&#125;

</script>
kai sthn eikona me to hyperlink:

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

<a href="javascript&#58;popImage&#40;'images/big-image.jpg','Popup Window title'&#41;">
<img border="0" src="images/small-image.jpg" width="200" height="200"></a>
Εικόνα

Inzoy
Δημοσιεύσεις: 23
Εγγραφή: 17 Μαρ 2004 17:01

Pop-Up images

Δημοσίευση από Inzoy » 04 Σεπ 2004 16:04

Να και η δική μου εκδοχή..

Μέσα στο <head></head>

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

  <SCRIPT language="javascript" type="text/JavaScript">
	<!--
	function PopupPic&#40;sPicURL&#41; &#123; 
		 window.open&#40; "popup.html?"+sPicURL, "",  
		 "resizable=0, HEIGHT=200, WIDTH=200, LEFT=10, TOP=10, scrollbars=0, toolbar=0, location=0, status=0, menubar=0, scrollbars=0"&#41;; 
	&#125;
	//-->
  </SCRIPT>
Τώρα για την εικόνα..

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

<a href="" onClick=javascript&#58;PopupPic&#40;path/to/image&#41; title="click to enlarge"><img src="path/to/image">

Και τέλος το αρχείο popup.html:

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

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http&#58;//www.w3.org/TR/html4/loose.dtd">
<HTML> 
 <HEAD> 
  <TITLE>CK Corporation Photo Viewer</title> <!-- einai apo thn selida mou, giafto -->
    <STYLE type="text/css">
   <!--
	body &#123;
		background-repeat&#58; no-repeat;
		background-position&#58; center;
		background-color&#58; #006699;
		margin&#58;0 0 0 0;
	&#125;-->
  </STYLE>
  <SCRIPT language='javascript' type='text/javascript'> 
	var arrTemp=self.location.href.split&#40;"?"&#41;; 
	var picUrl = &#40;arrTemp.length>0&#41;?arrTemp&#91;1&#93;&#58;""; 
	var NS = &#40;navigator.appName=="Netscape"&#41;?true&#58;false; 
	function FitPic&#40;&#41; &#123; 
	  iWidth = &#40;NS&#41;?window.innerWidth&#58;document.body.clientWidth; 
	  iHeight = &#40;NS&#41;?window.innerHeight&#58;document.body.clientHeight; 
	  iWidth = document.images&#91;0&#93;.width - iWidth; 
	  iHeight = document.images&#91;0&#93;.height - iHeight + 17; 
	  window.resizeBy&#40;iWidth, iHeight&#41;; 
	  self.focus&#40;&#41;; 
	&#125;; 
  </SCRIPT>
 </HEAD> 
 <BODY onload='FitPic&#40;&#41;;'> 
  <SCRIPT language='javascript' type='text/javascript'> 
	document.write&#40; "&lt;A href='javascript&#58;window.close&#40;&#41;'&gt;&lt;IMG src='" + picUrl + "' border=0 alt='Click here to close.'>&lt;/a&gt;" &#41;;
  </SCRIPT>
  <DIV align="center">
	<A href='javascript&#58;window.close&#40;&#41;' class='txt' style='color&#58;#FFFFFF' title="Click image or click here to close">&#91;Close&#93;</a>
  </DIV>
 </BODY>
</HTML>
Εύκολο μικρό και απλό :D
Λίγο πρόχειρα το έγραψα τώρα αλλα είναι κατανοητό.. Οι αλλαγές μπορούν να γίνουν στο πως θα είναι το παραθυρο που θα ανοίξει [πριν γίνει το fitpic()] και στο πώς θα είναι το popup.html

Άβαταρ μέλους
skull
Δημοσιεύσεις: 140
Εγγραφή: 02 Μαρ 2005 17:56
Τοποθεσία: Θεσσαλονίκη
Επικοινωνία:

Pop-Up images

Δημοσίευση από skull » 19 Απρ 2005 19:18

Το δοκιμασα και "παιζει" κανονικα...αλλα για το pimg.htm που οριζουμε την τοποθεσια του???

Άβαταρ μέλους
skeftomilos
Script Master
Δημοσιεύσεις: 2888
Εγγραφή: 07 Ιαν 2005 07:22
Τοποθεσία: Αθήνα

Pop-Up images

Δημοσίευση από skeftomilos » 19 Απρ 2005 21:09

Αν κάνεις search για τη λέξη pimg.htm στη σελίδα, θα τη βρεις τρεις φορές στο post του guesswho.

Για τα popups εικόνων, και συγκεκριμένα γι αυτό το ομολογουμένως έξυπνο script του Ray Stott, έχω κάνει μία παρατήρηση σε άσχετο θέμα.

Από τότε έχω ενισχύσει ακόμα περισσότερο την προστασία μου με ένα extension που δεν επιτρέπει κανένα απολύτως popup. Έχω τη γνώμη ότι ο χρήστης πρέπει να έχει απόλυτο έλεγχο πάνω στο tabs & windows management. Η προβολή των full-size εικόνων θα πρέπει να γίνεται στην ίδια ή διαφορετική σελίδα, στο ίδιο πάντως παράθυρο.
The pure and simple truth is rarely pure and never simple. Ο μη νους δε σκέπτεται μη σκέψεις για το τίποτα.

Άβαταρ μέλους
skull
Δημοσιεύσεις: 140
Εγγραφή: 02 Μαρ 2005 17:56
Τοποθεσία: Θεσσαλονίκη
Επικοινωνία:

Pop-Up images

Δημοσίευση από skull » 19 Απρ 2005 22:38

τα εχω βρει ετσι..αλλα χρησιμοποιω κατι σαν index.php?action=gallery και χανει την τοποθεσια.

Αυτο που λες θα μας το δειξεις??? :D

Άβαταρ μέλους
skeftomilos
Script Master
Δημοσιεύσεις: 2888
Εγγραφή: 07 Ιαν 2005 07:22
Τοποθεσία: Αθήνα

Pop-Up images

Δημοσίευση από skeftomilos » 20 Απρ 2005 01:45

Σόρρυ, εγκαταλείπω αυτό το thread γιατί έχει ξεχειλώσει η σελίδα και μου τη δίνει το οριζόντιο scrolling. :(

__________________________________________
EDIT: 4/09/2005

Απ' ό,τι φαίνεται το οριζόντιο scrolling εξαφανίστηκε ως εκ θαύματος! :D
The pure and simple truth is rarely pure and never simple. Ο μη νους δε σκέπτεται μη σκέψεις για το τίποτα.

Άβαταρ μέλους
sem27gr
Δημοσιεύσεις: 123
Εγγραφή: 13 Ιαν 2006 14:00
Τοποθεσία: Halandri-Athens
Επικοινωνία:

Pop-Up images

Δημοσίευση από sem27gr » 03 Μαρ 2006 02:27

Archangel έγραψε:Einai pragmati poly kalo. To xrhsimopoioysa gia poly kairo alla dysthxws einai xronoboro mexri na grapseis kai na ry8miseis thn istoria me ton kwdika.

San alternative, proteinw to ekshs.
.......[/code]
Το έκανα, όντως βολικό και γρήγορο, αλλά όταν το τρέχεις με explorer όταν η εικόνα είναι μεγάλη δεν εμφανίζει scroll δεξιά ή αριστερά με αποτέλεσμα να μην την βλέπεις όλη.... δείτε εδώ: http://www.gemma.gr/bolboi/bolboiAnoiksiat.html

Μήπως γίνεται διόρθωση στον κώδικα για να γίνεται και αυτό;
Στο mozilla εμφανίζει ωστόσο scroll bars

Άβαταρ μέλους
skeftomilos
Script Master
Δημοσιεύσεις: 2888
Εγγραφή: 07 Ιαν 2005 07:22
Τοποθεσία: Αθήνα

Pop-Up images

Δημοσίευση από skeftomilos » 03 Μαρ 2006 08:18

Οι εικόνες που έχεις είναι πολύ μεγάλες, και εξίσου μεγάλα είναι κα τα thumbs. 65KB το κάθε thumb είναι πολλά. Ίσως να ήταν λογικότερο αντί για popups να κάνεις απλά links για να εμφανίζονται οι εικόνες στο ίδιο παράθυρο. Έτσι δε θα υπάρχει πρόβλημα και με τους επισκέπτες χωρίς JavaScript, και με όσους έχουν popup blocker.

Ένα άλλο script που δεν ανοίγει πραγματικά παράθυρα αλλά ψευδοπαράθυρα: Image Thumbnail Viewer
Αλλά αυτό θα είναι μάλλον ακόμα χειρότερο για τόσο μεγάλες εικόνες. Μήπως να κόβονταν οι εικόνες σε κομμάτια;
The pure and simple truth is rarely pure and never simple. Ο μη νους δε σκέπτεται μη σκέψεις για το τίποτα.

Άβαταρ μέλους
sem27gr
Δημοσιεύσεις: 123
Εγγραφή: 13 Ιαν 2006 14:00
Τοποθεσία: Halandri-Athens
Επικοινωνία:

Pop-Up images

Δημοσίευση από sem27gr » 03 Μαρ 2006 12:47

skeftomilos έγραψε:Οι εικόνες που έχεις είναι πολύ μεγάλες, και εξίσου μεγάλα είναι κα τα thumbs. 65KB το κάθε thumb είναι πολλά. Ίσως να ήταν λογικότερο αντί για popups να κάνεις απλά links για να εμφανίζονται οι εικόνες στο ίδιο παράθυρο. Έτσι δε θα υπάρχει πρόβλημα και με τους επισκέπτες χωρίς JavaScript, και με όσους έχουν popup blocker.

Ένα άλλο script που δεν ανοίγει πραγματικά παράθυρα αλλά ψευδοπαράθυρα: Image Thumbnail Viewer
Αλλά αυτό θα είναι μάλλον ακόμα χειρότερο για τόσο μεγάλες εικόνες. Μήπως να κόβονταν οι εικόνες σε κομμάτια;
Μέχρι στιγμής έκανα τις εικόνες να ανοίγουν στο ίδιο παράθυρο αφού έκανα λινκ το thubnail στο αρχείο της εικόνας. Ωστόσο είχα πρόβλημα με τον explorer ο οποίος τις έκανε fit to screen. Όποιος δεν γνώριζε το κουμπάκι που φαίνεται αν αφήσεις για δύο δεύτερα το ποντίκι πάνω στην εικόνα, νόμιζε πως η μεγένθυση ήταν αυτή...Δεν γινόταν έτσι δουλειά...
Υπάρχουν pc που δεν έχουν java?και αν δεν έχουν το μενού πως θα το βλέπουν που είναι java?

Άβαταρ μέλους
skeftomilos
Script Master
Δημοσιεύσεις: 2888
Εγγραφή: 07 Ιαν 2005 07:22
Τοποθεσία: Αθήνα

Pop-Up images

Δημοσίευση από skeftomilos » 03 Μαρ 2006 15:16

Είναι δυνατό για την κάθε εικόνα να φτιαχτεί από μία αυτόνομη HTML σελίδα ώστε να μην υπάρχει το πρόβλημα fit to screen. Μπορεί ακόμα αν είναι πολλές οι εικόνες να φτιαχτεί δυναμικά με JavaScript αυτή η σελίδα, ή και server-side.

Υπάρχουν ορισμένοι που για διάφορους λόγους δεν έχουν JavaScript, είτε κατά βούληση είτε κατ' ανάγκη. Δεν είναι με ακρίβεια γνωστός ο αριθμός τους, πάντως δεν είναι στατιστικά πολλοί, ίσως γύρω στο 3-4%. Αυτοί δε θα δουν το μενού και δε θα μπορούν να κάνουν περιήγηση στο site. Ο τεχνικός όρος γι αυτό το πρόβλημα είναι χαμηλή προσβασιμότητα (low accessibility).

Σχετικά με το θέμα των χωρίς JavaScript χρηστών έχουμε κάνει παλιότερα μια συζήτηση εδώ: Με JavaScript ή χωρίς?
The pure and simple truth is rarely pure and never simple. Ο μη νους δε σκέπτεται μη σκέψεις για το τίποτα.

Άβαταρ μέλους
sem27gr
Δημοσιεύσεις: 123
Εγγραφή: 13 Ιαν 2006 14:00
Τοποθεσία: Halandri-Athens
Επικοινωνία:

Pop-Up images

Δημοσίευση από sem27gr » 03 Μαρ 2006 16:11

Δυστυχώς έχω 80 σελίδες Α4 με φωτογραφικό υλικό, που σημαίνει ότι πρέπει να περάσω 80νέες HTML σελίδες.... σκούρα τα πράγματα δηλαδή,μάλλον θα πέσει αγκαροδουλειά...
Thanks για τις απαντήσεις...

Άβαταρ μέλους
skeftomilos
Script Master
Δημοσιεύσεις: 2888
Εγγραφή: 07 Ιαν 2005 07:22
Τοποθεσία: Αθήνα

Pop-Up images

Δημοσίευση από skeftomilos » 04 Μαρ 2006 00:58

Εδώ έχω προτείνει ένα τρόπο που μπορεί ενδεχομένως να σε απαλλάξει από την αγγαρεία: Μαύρο background

Μια άλλη πιθανή ιδέα είναι να δημιουργηθούν αυτόματα όλες οι σελίδες με ένα windows script. Πάντως δεν είναι τόσο ευέλικτο όσο οι δυναμικές σελίδες.
The pure and simple truth is rarely pure and never simple. Ο μη νους δε σκέπτεται μη σκέψεις για το τίποτα.

nestoras7o
Δημοσιεύσεις: 1
Εγγραφή: 12 Μαρ 2008 20:11
Τοποθεσία: lamia

Pop-Up images

Δημοσίευση από nestoras7o » 12 Μαρ 2008 20:13

ArchangelX έγραψε:Einai pragmati poly kalo. To xrhsimopoioysa gia poly kairo alla dysthxws einai xronoboro mexri na grapseis kai na ry8miseis thn istoria me ton kwdika.

San alternative, proteinw to ekshs.

Mesa sto Head

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

<script>

// Set the horizontal and vertical position for the popup

PositionX = 5;
PositionY = 5;

// Set these value approximately 20 pixels greater than the
// size of the largest image to be used &#40;needed for Netscape&#41;

defaultWidth  = 600;
defaultHeight = 600;

// Set autoclose true to have the window close automatically
// Set autoclose false to allow multiple popup windows

var AutoClose = true;

// Do not edit below this line...
// ================================
if &#40;parseInt&#40;navigator.appVersion.charAt&#40;0&#41;&#41;>=4&#41;&#123;
var isNN=&#40;navigator.appName=="Netscape"&#41;?1&#58;0;
var isIE=&#40;navigator.appName.indexOf&#40;"Microsoft"&#41;!=-1&#41;?1&#58;0;&#125;
var optNN='scrollbars=no, width='+defaultWidth+', height='+defaultHeight+', left='+PositionX+', top='+PositionY;
var optIE='scrollbars=no, width=150, height=100, left='+PositionX+', top='+PositionY;
function popImage&#40;imageURL,imageTitle&#41;&#123;
if &#40;isNN&#41;&#123;imgWin=window.open&#40;'about&#58;blank','',optNN&#41;;&#125;
if &#40;isIE&#41;&#123;imgWin=window.open&#40;'about&#58;blank','',optIE&#41;;&#125;
with &#40;imgWin.document&#41;&#123;
writeln&#40;'<html><head><title>Loading...</title><style>body&#123;margin&#58;0px;&#125;</style>'&#41;;
writeln&#40;'<sc'+'ript>'&#41;;
writeln&#40;'var isNN,isIE;'&#41;;
writeln&#40;'if &#40;parseInt&#40;navigator.appVersion.charAt&#40;0&#41;&#41;>=4&#41;&#123;'&#41;;
writeln&#40;'isNN=&#40;navigator.appName=="Netscape"&#41;?1&#58;0;'&#41;;
writeln&#40;'isIE=&#40;navigator.appName.indexOf&#40;"Microsoft"&#41;!=-1&#41;?1&#58;0;&#125;'&#41;;
writeln&#40;'function reSizeToImage&#40;&#41;&#123;'&#41;;
writeln&#40;'if &#40;isIE&#41;&#123;'&#41;;
writeln&#40;'window.resizeTo&#40;100,100&#41;;'&#41;;
writeln&#40;'width=100-&#40;document.body.clientWidth-document.images&#91;0&#93;.width&#41;;'&#41;;
writeln&#40;'height=100-&#40;document.body.clientHeight-document.images&#91;0&#93;.height&#41;;'&#41;;
writeln&#40;'window.resizeTo&#40;width,height&#41;;&#125;'&#41;;
writeln&#40;'if &#40;isNN&#41;&#123;'&#41;;       
writeln&#40;'window.innerWidth=document.images&#91;"George"&#93;.width;'&#41;;
writeln&#40;'window.innerHeight=document.images&#91;"George"&#93;.height;&#125;&#125;'&#41;;
writeln&#40;'function doTitle&#40;&#41;&#123;document.title="'+imageTitle+'";&#125;'&#41;;
writeln&#40;'</sc'+'ript>'&#41;;
if &#40;!AutoClose&#41; &#123;
writeln&#40;'</head><body bgcolor=000000 scroll="no" onload="reSizeToImage&#40;&#41;;doTitle&#40;&#41;;self.focus&#40;&#41;">'&#41;;
&#125;
else &#123;
writeln&#40;'</head><body bgcolor=000000 scroll="no" onload="reSizeToImage&#40;&#41;;doTitle&#40;&#41;;self.focus&#40;&#41;"'&#41;;
writeln&#40;' onblur="self.close&#40;&#41;">'&#41;;
&#125;
writeln&#40;'<img name="George" src='+imageURL+' style="display&#58;block"></body></html>'&#41;;
close&#40;&#41;;		
&#125;&#125;

</script>
kai sthn eikona me to hyperlink:

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

<a href="javascript&#58;popImage&#40;'images/big-image.jpg','Popup Window title'&#41;">
<img border="0" src="images/small-image.jpg" width="200" height="200"></a>
Πολυ καλο,αλλα υπαρχει τροπος να δουλεψει και σε opera???

Απάντηση

Επιστροφή στο “JavaScript και Frameworks”

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

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