Close
Faqja 1 prej 2 12 FunditFundit
Duke shfaqur rezultatin 1 deri 20 prej 21
  1. #1
    Restaurator Orbis Maska e Baptist
    Anėtarėsuar
    20-11-2004
    Postime
    8,736
    Faleminderit
    0
    Falenderuar 1 herė nė 1 postim

    Pure CSS Image Gallery demo

    Nje "giveaway" nga truqet e mia.
    Kodim i faqes per galeri fotografish pa perdorimin e java-skriptit.
    [version demonstrativ ne zhvillim].

    I testuar ne ie6 fx3.5, opera 9x...
    Marre parasysh se kodin e kam bazuar ne CSS v1.0. mund te them me siguri te plote se punon edhe ne IE 5 me gjase ndoshta edhe ne 4.01. Por kjo nuk me kujtohet andaj dhe mund te gabohem.


    Rezultati ka kete pamje:


    Ndersa kodi eshte ky:
    Kodi:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
    
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
    <title>Image Gallery</title>
    	<style type="text/css">
    		*
    		{ 
    			margin:	0;
    			padding:	0;
    			border:	0;
    			font-family: 'Trebuchet MS', Helvetica, sans-serif;
    		}
    		body
    		{
    			background:	white;
    			width:	774px; 
    			margin:	5px auto;
    		}
    		.gallery
    		{
    			position:	relative;
    			height:	100%;
    			width:	100%; 
    			margin:	4px 0 4px 0px;
    			background: url('http://www.layoutstar.com/images/allbackgrounds/bgs/artistic/artistic_background_01.gif') no-repeat 66% 56%; 
    		}
    		.thumb span
    		{
    			position:	absolute;
    			top:		1px;
    			left:		218px;
    			border:	outset 1px #f0f9ff; 
    			visibility:	hidden;
    			text-decoration:	none;
    			color:	black;
    			padding:	30px; 
    		}
    		.n1:active span,.n1:focus span
    		{
    			background:	url('http://www.billfrymire.com/gallery/webJpgs/dry-drought-arid-dirt.jpg')
    		}
    		.n2:active span,.n2:focus span
    		{
    			background:	url('http://www.billfrymire.com/gallery/webJpgs/Sun-Valley-golf-course.jpg')
    		}
    		.n3:active span,.n3:focus span
    		{
    			background:	url('http://www.billfrymire.com/gallery/webJpgs/close-up-colorful-iris.jpg')
    		}
    		.n4:active span,.n4:focus span
    		{
    			background:	url('http://www.billfrymire.com/gallery/webJpgs/stress-fish-blender.jpg')
    		}
    		.n5:active span,.n5:focus span
    		{
    			background:	url('http://www.billfrymire.com/gallery/webJpgs/paragliding-valley-sport.jpg')
    		}
    		.n6:active span,.n6:focus span
    		{
    			background:	url('http://www.billfrymire.com/gallery/webJpgs/hurricane-space-earth-horizontal.jpg')
    		}
    		.n7:active span,.n7:focus span
    		{
    			background:	url('http://www.billfrymire.com/gallery/webJpgs/world-globe-in-oyster-beach.jpg')
    		}
    		.n8:active span,.n8:focus span
    		{
    			background:	url('http://www.billfrymire.com/gallery/webJpgs/periodic-table-chemistry-science.jpg')
    		}
    		.thumb:active span,.thumb:focus span
    		{
    			visibility:	visible;
    			background-repeat: no-repeat;
    			background-position: center 30%;
    			background-color: #f9f9fa;
    		}  
                .thumb:active img,.thumb:focus img
    		{
    			border: 1px #666 solid
    		}
    
    		a img
    		{
    			height:	102px;
    			width:	102px;
    		}
    		span img
    		{
    			visibility:	hidden; 
    			width:	490px; 
    			height:	320px; 
    			display:	block; 
    		}
    		h1
    		{
    			padding:	30px 20px 30px 15px; 
    			background-color: #444;
    			color:	#f0f9ff;
    			padding-left: 20px;
    		}
    		h1 i
    		{
    		color:	#aaff44;
    		}
    		b.o,b.m,b.x,b.i
    		{
    			display: block; background: #444; padding-top: 1px;
    		}
    		b.o 
    		{
    			margin: 0px 6px
    		}
    		b.m 
    		{
    			margin: 0px 3px
    		}
    		b.x
    		{
    			margin: 0px 2px
    		}
    		b.i
    		{
    			margin: 0px 1px; padding-top:2px
    		}
    		h2, h2 span
    		{
    			overflow: hidden;
    			font: bold 38pt/1.2em georgia, 'Trebuchet MS';
    			position: relative;
    			width: 100%;
    			text-align: center;
    			color: #999;
    			background: #444
    		}
    		h2 span, h2 br
    		{
    			color: #ddd; 
    			top: 0px; left:0px;
    			position: absolute; 
    			display: block;
    			width: 100%;
    			height: .575em;
    		}
    		h1 small
    		{
    			font-size: 0.5em;
    			display: block;
    		}
    		#botm
    		{
    			text-align: center;
    			width: 100%;
    			color: #444;
    			line-height: 2em;
    			background: #fcfdfe;
    		}
    
    		.gallery img
    		{
    			border: 1px #fff outset
    		}
                a
                {
    			outline:none 0; 
    		}
    		#au
    		{
    			background:	url('http://i35.tinypic.com/xbkdg9.jpg') repeat-x;
    			font: normal 11px Tahoma;
    			color: #000;
    			border-top: 1px solid #ddd; 
    			height: 25px;
    			line-height: 25px;
    			margin-top: 5px
    		}
    	</style>
    <!--[if IE]>
    	<style>
    	a {outline:expression(hideFocus='true')
    	</style>
    <![endif]-->
    </head>
    
    <body>
    <div>
     <b class="o"></b>
     <b class="m"></b>
     <b class="x"></b>
     <b class="i"></b>
    <h1>Pure <i>CSS</i> Image Gallery demo<br><small>with <i>on click</i> swap</small></h1> 
     <b class="i"></b>
     <b class="x"></b>
     <b class="m"></b>
     <b class="o"></b>
    </div>
    
    <div id="au">
    &nbsp; &bull; Aeneas Dardanus &bull;
    </div>
    
    <div class="gallery">
    <a class="thumb n1" href="#">
    <img src="http://www.billfrymire.com/gallery/webthumbs/dry-drought-arid-dirt.jpg" alt=''><span>
    <img src="" alt=''><br>Dried... (Bonneville Salt Flats)</span></a>
    <a class="thumb n2" href="#">
    <img src="http://www.billfrymire.com/gallery/webthumbs/Sun-Valley-golf-course.jpg" alt=''><span>
    <img src="" alt=''><br>Sun Valley, -looks green... (Idaho USA golf course)</span></a>
    <br>
    <a class="thumb n3" href="#">
    <img src="http://www.billfrymire.com/gallery/webthumbs/close-up-colorful-iris.jpg" alt=''><span>
    <img src="" alt=''><br>Some Colorful surprise.</span></a> 
    <a class="thumb n4" href="#">
    <img src="http://www.billfrymire.com/gallery/webthumbs/stress-fish-blender.jpg" alt=''><span>
    <img src="" alt=''><br>Feeling safe?</span></a>
    <br>
    <a class="thumb n5" href="#">
    <img src="http://www.billfrymire.com/gallery/webthumbs/paragliding-valley-sport.jpg" alt=''><span>
    <img src="" alt=''><br>Watch this...</span></a> 
    <a class="thumb n6" href="#">
    <img src="http://www.billfrymire.com/gallery/webthumbs/hurricane-space-earth-horizontal.jpg" alt=''><span>
    <img src="" alt=''><br>Hurricane or typhoon? -Can't tell - but it's Huge!</span></a>
    <br>
    <a class="thumb n7" href="#">
    <img src="http://www.billfrymire.com/gallery/webthumbs/world-globe-in-oyster-beach.jpg" alt=''><span>
    <img src="" alt=''><br>...Some Nut in a shelve</span></a> 
    <a class="thumb n8" href="#">
    <img src="http://www.billfrymire.com/gallery/webthumbs/periodic-table-chemistry-science.jpg" alt=''><span>
    <img src="" alt=''><br>Need some chemistry to start things over.</span></a>
    </div>
    
    <div id=botm>
    <p><small> Gallery <i>Images</i> are a property of 
    <a href='http://www.billfrymire.com' title="you can see more here">bill frymire visuals</a>
     |&bull;|  b.b. Troy III p.a.e. </small></p>
    </div>
    
    <div style='border-top: solid 3px #af4; margin:0'>
    <H2 title="TROY III"> TROY III <br><span> TROY III </span> </H2>
     <b class="i"></b>
     <b class="x"></b>
     <b class="m"></b>
     <b class="o"></b>
    </div>
    
    </body>
    </html>
    Perparesite ndaj tentimeve te ngjashme qe mund t'i gjeni ne internet:
    1. fotografite e medha nuk ngarkohen bashke me faqen duke shaktuar keshtu nje vonese te madhe dhe te pakuptueshme per shfrytezuesin. .
    2. Mundeson shfletimin e fotografive te galerise duke klikuar per dallim nga te tjerat qe kryesisht kerkojne shenjuesin te qendroje mbi mostren.
    3. Validon si DTD HTML 4.01 STRIKT dhe CSS 2.1.
    4. Mund te navigohet edhe me TAB-stop pa ndihmen e shenjuesit.

    mangesia:
    Nuk indikon vizuelisht shkarkimin e fotografise se madhe ne meskohe. [Gje qe mund te rregullohet, por shton kodin pa nevoje].
    Aeneas Dardanus
    Lavdi, pasthirrme fosilesh, germadhash e rrenojash vershelluese. -Eja pas meje!...

  2. #2
    Desert Eagle Maska e 'MAGNUM'
    Anėtarėsuar
    22-05-2009
    Vendndodhja
    Gefangen in Raum und Zeit
    Postime
    140
    Faleminderit
    0
    0 falenderime nė 0 postime
    Citim Postuar mė parė nga Baptist Lexo Postimin
    2. Mundeson shfletimin e fotografive te galerise duke klikuar per dallim nga te tjerat qe kryesisht kerkojne shenjuesin te qendroje mbi mostren.
    Po mendon keshtu diēka si keto me poshte ?

    Fotogaleri pa klikime:

    Kodi:
     <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <!-- saved from url=(0058)http://home.arcor.de/terrikay/css-galerie/ulle1_demo.html -->
    <HTML lang=de xml:lang="de" xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>Ulles Galerie, Version1</TITLE>
    <META content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
    <STYLE type=text/css>HTML {
    	PADDING-BOTTOM: 0px; BACKGROUND-COLOR: #c0c0c0; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; FONT-FAMILY: Verdana, Geneva, Arial, Helvetica, sans-serif; COLOR: #000000; FONT-SIZE: 100.01%; PADDING-TOP: 0px
    }
    BODY {
    	PADDING-BOTTOM: 0px; BACKGROUND-COLOR: #c0c0c0; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; FONT-FAMILY: Verdana, Geneva, Arial, Helvetica, sans-serif; COLOR: #000000; FONT-SIZE: 100.01%; PADDING-TOP: 0px
    }
    #gallery_position {
    	MARGIN: 3em
    }
    #gallery {
    	BORDER-BOTTOM: #000000 1px solid; POSITION: relative; BORDER-LEFT: #000000 1px solid; BACKGROUND-COLOR: #efedec; WIDTH: 456px; HEIGHT: 405px; BORDER-TOP: #000000 1px solid; BORDER-RIGHT: #000000 1px solid
    }
    #gallery IMG {
    	BORDER-BOTTOM: #000000 1px solid; BORDER-LEFT: #000000 1px solid; MARGIN: 25px; WIDTH: 386px; HEIGHT: 256px; BORDER-TOP: #000000 1px solid; BORDER-RIGHT: #000000 1px solid
    }
    #gallery A {
    	BORDER-BOTTOM: #000000 1px solid; BORDER-LEFT: #000000 1px solid; MARGIN: 4px; WIDTH: 80px; DISPLAY: block; FLOAT: left; HEIGHT: 53px; BORDER-TOP: #000000 1px solid; BORDER-RIGHT: #000000 1px solid; TEXT-DECORATION: none
    }
    #gallery A:visited {
    	BORDER-BOTTOM: #000000 1px solid; BORDER-LEFT: #000000 1px solid; MARGIN: 4px; WIDTH: 80px; DISPLAY: block; FLOAT: left; HEIGHT: 53px; BORDER-TOP: #000000 1px solid; BORDER-RIGHT: #000000 1px solid; TEXT-DECORATION: none
    }
    #gallery A SPAN {
    	BACKGROUND-COLOR: #efedec; DISPLAY: none
    }
    #gallery A SPAN IMG {
    	BORDER-BOTTOM: #000000 1px solid; BORDER-LEFT: #000000 1px solid; MARGIN: 0px; WIDTH: 386px; HEIGHT: 256px; BORDER-TOP: #000000 1px solid; BORDER-RIGHT: #000000 1px solid
    }
    #gallery A:hover {
    	BORDER-BOTTOM: #ffffff 1px solid; BORDER-LEFT: #ffffff 1px solid; BORDER-TOP: #ffffff 1px solid; BORDER-RIGHT: #ffffff 1px solid
    }
    #gallery A:focus {
    	BORDER-BOTTOM: #ffffff 1px solid; BORDER-LEFT: #ffffff 1px solid; BORDER-TOP: #ffffff 1px solid; BORDER-RIGHT: #ffffff 1px solid
    }
    #gallery A:unknown {
    	BORDER-BOTTOM: #ffffff 1px solid; BORDER-LEFT: #ffffff 1px solid; BORDER-TOP: #ffffff 1px solid; BORDER-RIGHT: #ffffff 1px solid
    }
    #gallery A:hover SPAN {
    	Z-INDEX: 2; POSITION: absolute; WIDTH: 402px; DISPLAY: block; TOP: 88px; LEFT: 25px
    }
    #gallery A:focus SPAN {
    	Z-INDEX: 2; POSITION: absolute; WIDTH: 402px; DISPLAY: block; TOP: 88px; LEFT: 25px
    }
    #gallery A:active SPAN {
    	Z-INDEX: 2; POSITION: absolute; WIDTH: 402px; DISPLAY: block; TOP: 88px; LEFT: 25px
    }
    #gallery A:focus SPAN {
    	Z-INDEX: 1
    }
    #gallery A:active SPAN {
    	Z-INDEX: 1
    }
    </STYLE>
    
    <META name=GENERATOR content="MSHTML 8.00.6001.18813"></HEAD>
    <BODY>
    <DIV id=gallery_position>
    <DIV id=gallery><A style="BACKGROUND-IMAGE: url(thumb1.jpg)" 
    href="http://home.arcor.de/terrikay/css-galerie/ulle1_demo.html#"><SPAN><IMG 
    title="Bild 1" alt=Bild1 src="Ohne%20klick-Dateien/bild1.jpg"> Bildunterschrift 
    1 </SPAN></A><A style="BACKGROUND-IMAGE: url(thumb2.jpg)" 
    href="http://home.arcor.de/terrikay/css-galerie/ulle1_demo.html#"><SPAN><IMG 
    alt=Bild2 src="Ohne%20klick-Dateien/bild2.jpg"> Bildunterschrift 2 </SPAN></A><A 
    style="BACKGROUND-IMAGE: url(thumb3.jpg)" 
    href="http://home.arcor.de/terrikay/css-galerie/ulle1_demo.html#"><SPAN><IMG 
    alt=Bild3 src="Ohne%20klick-Dateien/bild3.jpg"> Bildunterschrift 3 </SPAN></A><A 
    style="BACKGROUND-IMAGE: url(thumb4.jpg)" 
    href="http://home.arcor.de/terrikay/css-galerie/ulle1_demo.html#"><SPAN><IMG 
    alt=Bild4 src="Ohne%20klick-Dateien/bild4.jpg"> Bildunterschrift 4 </SPAN></A><A 
    style="BACKGROUND-IMAGE: url(thumb5.jpg)" 
    href="http://home.arcor.de/terrikay/css-galerie/ulle1_demo.html#"><SPAN><IMG 
    alt=Bild5 src="Ohne%20klick-Dateien/bild5.jpg"> Bildunterschrift 5 
    </SPAN></A><IMG class=bild1 alt="Bild 1" src="Ohne%20klick-Dateien/bild1.jpg"> 
    </DIV></DIV></BODY></HTML>
    Dhe fotogaleri me klikime:

    Kodi:
     <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <!-- saved from url=(0043)http://home.arcor.de/terrikay/css-galerie/ -->
    <HTML lang=de xml:lang="de" xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>Bildergalerie mit CSS</TITLE>
    <META content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
    <STYLE type=text/css>HTML {
    	PADDING-BOTTOM: 0px; BACKGROUND-COLOR: #afafaf; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; FONT-FAMILY: Verdana, Geneva, Arial, Helvetica, sans-serif; COLOR: #000000; FONT-SIZE: 100.01%; PADDING-TOP: 0px
    }
    BODY {
    	PADDING-BOTTOM: 0px; BACKGROUND-COLOR: #afafaf; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; FONT-FAMILY: Verdana, Geneva, Arial, Helvetica, sans-serif; COLOR: #000000; FONT-SIZE: 100.01%; PADDING-TOP: 0px
    }
    #gallery_position {
    	MARGIN: 3em
    }
    #gallery {
    	BORDER-BOTTOM: #000000 1px solid; POSITION: relative; BORDER-LEFT: #000000 1px solid; BACKGROUND-COLOR: #efedec; WIDTH: 456px; HEIGHT: 405px; BORDER-TOP: #000000 1px solid; BORDER-RIGHT: #000000 1px solid
    }
    #gallery IMG {
    	MARGIN: 25px; WIDTH: 386px; HEIGHT: 256px
    }
    #gallery A {
    	BORDER-BOTTOM: #000000 1px solid; BORDER-LEFT: #000000 1px solid; MARGIN: 4px; WIDTH: 80px; DISPLAY: block; FLOAT: left; HEIGHT: 53px; BORDER-TOP: #000000 1px solid; BORDER-RIGHT: #000000 1px solid; TEXT-DECORATION: none
    }
    #gallery A:visited {
    	BORDER-BOTTOM: #000000 1px solid; BORDER-LEFT: #000000 1px solid; MARGIN: 4px; WIDTH: 80px; DISPLAY: block; FLOAT: left; HEIGHT: 53px; BORDER-TOP: #000000 1px solid; BORDER-RIGHT: #000000 1px solid; TEXT-DECORATION: none
    }
    #gallery A SPAN {
    	DISPLAY: none
    }
    #gallery A STRONG {
    	DISPLAY: none
    }
    #gallery A SPAN EM {
    	MARGIN: 0px; WIDTH: 384px; DISPLAY: block; HEIGHT: 256px
    }
    #gallery A:focus {
    	BORDER-BOTTOM: #666666 1px solid; BORDER-LEFT: #666666 1px solid; BORDER-TOP: #666666 1px solid; BORDER-RIGHT: #666666 1px solid
    }
    #gallery A:active {
    	BORDER-BOTTOM: #666666 1px solid; BORDER-LEFT: #666666 1px solid; BORDER-TOP: #666666 1px solid; BORDER-RIGHT: #666666 1px solid
    }
    #gallery A:focus SPAN {
    	Z-INDEX: 1; POSITION: absolute; WIDTH: 386px; DISPLAY: block; COLOR: #000000; FONT-SIZE: 0.8em; TOP: 88px; LEFT: 26px
    }
    #gallery A:active SPAN {
    	Z-INDEX: 1; POSITION: absolute; WIDTH: 386px; DISPLAY: block; COLOR: #000000; FONT-SIZE: 0.8em; TOP: 88px; LEFT: 26px
    }
    #gallery A:focus STRONG {
    	POSITION: absolute; BACKGROUND-COLOR: #efedec; WIDTH: 384px; DISPLAY: block; HEIGHT: 256px; COLOR: #1199ff; FONT-SIZE: 0.8em; TOP: 87px; LEFT: 27px
    }
    #gallery A:active STRONG {
    	POSITION: absolute; BACKGROUND-COLOR: #efedec; WIDTH: 384px; DISPLAY: block; HEIGHT: 256px; COLOR: #1199ff; FONT-SIZE: 0.8em; TOP: 87px; LEFT: 27px
    }
    </STYLE>
    
    <META name=GENERATOR content="MSHTML 8.00.6001.18813"></HEAD>
    <BODY>
    <DIV id=gallery_position>
    <DIV id=gallery><A style="BACKGROUND-IMAGE: url(thumb1.jpg)" title=loading 
    href="http://home.arcor.de/terrikay/css-galerie/#"><STRONG>Loading......</STRONG> 
    <SPAN><EM style="BACKGROUND-IMAGE: url(bild1.jpg)">&nbsp;</EM> Bildunterschrift 
    1 </SPAN></A><A style="BACKGROUND-IMAGE: url(thumb2.jpg)" title=loading 
    href="http://home.arcor.de/terrikay/css-galerie/#"><STRONG>Loading......</STRONG> 
    <SPAN><EM style="BACKGROUND-IMAGE: url(bild2.jpg)">&nbsp;</EM> Bildunterschrift 
    2 </SPAN></A><A style="BACKGROUND-IMAGE: url(thumb3.jpg)" title=loading 
    href="http://home.arcor.de/terrikay/css-galerie/#"><STRONG>Loading......</STRONG> 
    <SPAN><EM style="BACKGROUND-IMAGE: url(bild3.jpg)">&nbsp;</EM> Bildunterschrift 
    3 </SPAN></A><A style="BACKGROUND-IMAGE: url(thumb4.jpg)" title=loading 
    href="http://home.arcor.de/terrikay/css-galerie/#"><STRONG>Loading......</STRONG> 
    <SPAN><EM style="BACKGROUND-IMAGE: url(bild4.jpg)">&nbsp;</EM> Bildunterschrift 
    4 </SPAN></A><A style="BACKGROUND-IMAGE: url(thumb5.jpg)" title=loading 
    href="http://home.arcor.de/terrikay/css-galerie/#"><STRONG>Loading......</STRONG> 
    <SPAN><EM style="BACKGROUND-IMAGE: url(bild5.jpg)">&nbsp;</EM> Bildunterschrift 
    5 </SPAN></A><IMG alt=bild src="mit%20klick-Dateien/bild1.jpg"> 
    </DIV></DIV></BODY></HTML>
    Ndryshuar pėr herė tė fundit nga 'MAGNUM' : 01-10-2009 mė 01:48
    Kosova kurre nuk ka patur armik me te rrezikshem se PDK e Hashim Thaqit a.k.a. Hashim Kompromisit.

  3. #3
    Desert Eagle Maska e 'MAGNUM'
    Anėtarėsuar
    22-05-2009
    Vendndodhja
    Gefangen in Raum und Zeit
    Postime
    140
    Faleminderit
    0
    0 falenderime nė 0 postime
    Ja shiko si ta kam perfekcionuar fotogalerine:




    Ja edhe Kodi:

    Kodi:
     <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
     
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
    <title>Image Gallery</title>
    	<style type="text/css">
    		*
    		{ 
    			margin:	0;
    			padding:	0;
    			border:	0;
    			font-family: 'Trebuchet MS', Helvetica, sans-serif;
    		}
    		body
    		{
    			background:	black;
    			width:	777px; 
    			margin:	10px auto;
    		}
    		.gallery
    		{
    			position:	relative;
    			top:		2px;
    			height:	100%;
    			width:	100%; 
    			margin:	4px 0 4px 0px;
    			background: url('http://www.layoutstar.com/images/allbackgrounds/bgs/artistic/artistic_background_01.gif') no-repeat 66% 56%; 
    		}
    		.thumb span
    		{
    			position:	absolute;
    			top:		0px;
    			left:		220px;
    			border:	outset 2px #FF0000;
    			visibility:	hidden;
    			text-decoration:	none;
    			color:	red;
    			padding:	30px; 
    		}
    		.n1:active span,.n1:focus span
    		{
    			background:	url('http://www.billfrymire.com/gallery/webJpgs/dry-drought-arid-dirt.jpg')
    		}
    		.n2:active span,.n2:focus span
    		{
    			background:	url('http://www.billfrymire.com/gallery/webJpgs/Sun-Valley-golf-course.jpg')
    		}
    		.n3:active span,.n3:focus span
    		{
    			background:	url('http://www.billfrymire.com/gallery/webJpgs/close-up-colorful-iris.jpg')
    		}
    		.n4:active span,.n4:focus span
    		{
    			background:	url('http://www.billfrymire.com/gallery/webJpgs/stress-fish-blender.jpg')
    		}
    		.n5:active span,.n5:focus span
    		{
    			background:	url('http://www.billfrymire.com/gallery/webJpgs/paragliding-valley-sport.jpg')
    		}
    		.n6:active span,.n6:focus span
    		{
    			background:	url('http://www.billfrymire.com/gallery/webJpgs/hurricane-space-earth-horizontal.jpg')
    		}
    		.n7:active span,.n7:focus span
    		{
    			background:	url('http://www.billfrymire.com/gallery/webJpgs/world-globe-in-oyster-beach.jpg')
    		}
    		.n8:active span,.n8:focus span
    		{
    			background:	url('http://www.billfrymire.com/gallery/webJpgs/periodic-table-chemistry-science.jpg')
    		}
    		.thumb:active span,.thumb:focus span
    		{
    			visibility:	visible;
    			background-repeat: no-repeat;
    			background-position: center 35%;
    			background-color: #F5F5DC;
    		}  
                .thumb:active img,.thumb:focus img
    		{
    			border: 2px #C0C0C0 solid
    		}
     
    		a img
    		{
    			height:	101px;
    			width:	101px;
    		}
    		span img
    		{
    			visibility:	hidden; 
    			width:	490px; 
    			height:	323px; 
    			display:	block; 
    		}
    		h1
    		{
    			padding:	10px 20px 10px 15px; 
    			background-color: #444;
    			color:	#f0f9ff;
    			padding-left: 165px;
    		}
    		h1 i
    		{
    		color:	#FF0000;
    		}
    		b.o,b.m,b.x,b.i
    		{
    			display: block; background: #444; padding-top: 1px;
    		}
    		b.o 
    		{
    			margin: 0px 5px; background: #888
    		}
    		b.m 
    		{
    			margin: 0px 3px; background: #777
    		}
    		b.x
    		{
    			margin: 0px 2px; background: #666
    		}
    		b.i
    		{
    			margin: 0px 1px; background: #555; padding-top:2px
    		}
    		h2, h2 span
    		{
    			overflow: hidden;
    			font: bold 38pt/1.2em georgia, 'Trebuchet MS';
    			position: relative;
    			width: 100%;
    			text-align: center;
    			color: #999;
    			background: #444
    		}
    		h2 span, h2 br
    		{
    			color: #ddd; 
    			top: 0px; left:0px;
    			position: absolute; 
    			display: block;
    			width: 100%;
    			height: .575em;
    		}
    		h1 small
    		{
    			font-size: 0.5em;
    			display: block;
                            padding-left: 145px;
    		}
    		#botm
    		{
    			background:	url('http://i35.tinypic.com/xbkdg9.jpg') repeat-x;
    			font: normal 13px Tahoma;
                            padding-left: 185px;
    			color: #000;
    			border-top: 1px solid #ddd; 
    			height: 25px;
    			line-height: 25px;
    			margin-top: 5px
    			color: #444;
    		}
     
    		.gallery img
    		{
    			border: 2px #FF0000 outset
    		}
                a
                {
    			outline:none 0; 
    		}
    		#au
    		{
    			background:	url('http://i35.tinypic.com/xbkdg9.jpg') repeat-x;
    			font: normal 11px Tahoma;
                            padding-left: 175px;
    			color: #000;
    			border-top: 1px solid #ddd; 
    			height: 25px;
    			line-height: 25px;
    			margin-top: 0px
    		}
    	</style>
    <!--[if IE]>
    	<style>
    	a {outline:expression(hideFocus='true')
    	</style>
    <![endif]-->
    </head>
     
    <body>
    <div>
    <div style='border-bottom: solid 3px #FF0000; margin:0'>
     <b class="o"></b>
     <b class="m"></b>
     <b class="x"></b>
     <b class="i"></b>
    <h1>Pure <i>CSS</i> Image Gallery demo<br><small>with <i>on click</i> swap</small></h1> 
    </div>
     
    <div id="au">
    &nbsp; &bull; Dikur m'pate kupe m'pate hupe n'shupe deri t'pata gjete m'pate kupe - <i>'MAGNUM'</i> &bull;
    </div>
     
    <div class="gallery">
    <a class="thumb n1" href="#">
    <img src="http://www.billfrymire.com/gallery/webthumbs/dry-drought-arid-dirt.jpg" alt=''><span>
    <img src="" alt=''><br>Dried... (Bonneville Salt Flats)</span></a>
    <a class="thumb n2" href="#">
    <img src="http://www.billfrymire.com/gallery/webthumbs/Sun-Valley-golf-course.jpg" alt=''><span>
    <img src="" alt=''><br>Sun Valley, -looks green... (Idaho USA golf course)</span></a>
    <br>
    <a class="thumb n3" href="#">
    <img src="http://www.billfrymire.com/gallery/webthumbs/close-up-colorful-iris.jpg" alt=''><span>
    <img src="" alt=''><br>Some Colorful surprise.</span></a> 
    <a class="thumb n4" href="#">
    <img src="http://www.billfrymire.com/gallery/webthumbs/stress-fish-blender.jpg" alt=''><span>
    <img src="" alt=''><br>Feeling safe?</span></a>
    <br>
    <a class="thumb n5" href="#">
    <img src="http://www.billfrymire.com/gallery/webthumbs/paragliding-valley-sport.jpg" alt=''><span>
    <img src="" alt=''><br>Watch this...</span></a> 
    <a class="thumb n6" href="#">
    <img src="http://www.billfrymire.com/gallery/webthumbs/hurricane-space-earth-horizontal.jpg" alt=''><span>
    <img src="" alt=''><br>Hurricane or typhoon? -Can't tell - but it's Huge!</span></a>
    <br>
    <a class="thumb n7" href="#">
    <img src="http://www.billfrymire.com/gallery/webthumbs/world-globe-in-oyster-beach.jpg" alt=''><span>
    <img src="" alt=''><br>...Some Nut in a shelve</span></a> 
    <a class="thumb n8" href="#">
    <img src="http://www.billfrymire.com/gallery/webthumbs/periodic-table-chemistry-science.jpg" alt=''><span>
    <img src="" alt=''><br>Need some chemistry to start things over.</span></a>
    </div>
     
    <div id=botm>
    <p><small> Gallery <i>Images</i> are a property of 
    <a href='http://www.billfrymire.com' title="you can see more here">bill frymire visuals</a>
     |&bull;|  'MAGNUM'- Desert Eagle </small></p>
    </div>
     
    <div style='border-top: solid 3px #FF0000; margin:0'>
    <H2 title="'MAGNUM'"> 'MAGNUM' <br><span> 'MAGNUM' </span> </H2>
     <b class="i"></b>
     <b class="x"></b>
     <b class="m"></b>
     <b class="o"></b>
    </div>
     
    </body>
    </html>

    Emrin dhe firmen nderroja vet, poashtu nderroja vet edhe ngjyrat, sipas shijes tende.


    Tungat zotni
    Ndryshuar pėr herė tė fundit nga Darius : 02-10-2009 mė 23:25
    Kosova kurre nuk ka patur armik me te rrezikshem se PDK e Hashim Thaqit a.k.a. Hashim Kompromisit.

  4. #4
    Desert Eagle Maska e 'MAGNUM'
    Anėtarėsuar
    22-05-2009
    Vendndodhja
    Gefangen in Raum und Zeit
    Postime
    140
    Faleminderit
    0
    0 falenderime nė 0 postime
    Ja se si duket me ato ngjyrat e tua:




    Kjo fotogaleria jote nuk te funkcionon edhe aq mire, kercen e ter faqja kur te klikosh per ti nderruar fotot, pastaj te duhet te klikosh dikund jashta fotogalerise qe te mund ti rishikosh edhe nje here fotot etj. per ate arsye ta solla ate fotogalerine tjeter me klikime dhe pa klikime, qe ta shikosh vet se si eshte krijuar ajo fotogaleri, dhe ti rregullosh ato defekte ne kete fotogalerine tende. Fotogalerine qe e solla une e ke ne postimin tim te pare ne kete teme.

    Tung
    Ndryshuar pėr herė tė fundit nga Darius : 02-10-2009 mė 23:26
    Kosova kurre nuk ka patur armik me te rrezikshem se PDK e Hashim Thaqit a.k.a. Hashim Kompromisit.

  5. #5
    Restaurator Orbis Maska e Baptist
    Anėtarėsuar
    20-11-2004
    Postime
    8,736
    Faleminderit
    0
    Falenderuar 1 herė nė 1 postim
    Citim Postuar mė parė nga 'MAGNUM' Lexo Postimin
    Kjo fotogaleria jote nuk te funkcionon edhe aq mire, kercen e ter faqja kur te klikosh per ti nderruar fotot, pastaj te duhet te klikosh dikund jashta fotogalerise qe te mund ti rishikosh edhe nje here fotot etj. per ate arsye ta solla ate fotogalerine tjeter me klikime dhe pa klikime, qe ta shikosh vet se si eshte krijuar ajo fotogaleri, dhe ti rregullosh ato defekte ne kete fotogalerine tende. Mirpo ti vendose ta kalosh uren me sy mbyllur. Fotogalerine qe e solla une e ke ne postimin tim te pare ne kete teme, nese nuk te vjen inati ta rishikosh edhe nje here.

    Tung
    Me vjen keq qe po kercejne, por kjo do te thote se ke prezentuar ndonje gabim ri diku ne kod. Sepse kodi origjinal nuk kercen askund.
    Me pelqen ajo qe kishe bere me thuresit e skajeve rrethore.
    megjithese qeshtja e ngjyrave eshte qeshtje e shijes mendoj se ne prapavi te zeze serish rri me mire ngjyra e se gjelbertes se re se e kuqja, sidomos kur pala tjeter jane te bardha, ndersa kornizat e mostrave te fotografive i ke theksuar me teper se c'duhet.

    kodi i gjermanit eshte i mire por ka pak teprim ne keqperdorim te html tiketave qe nuk ben te perdoren jashte semantikes se vet, si dhe nuk ka gjetur menyren si ta ndaje css nga html por galeria e tij eshte e paisur me ate qe une kam cekur se nuk e kam.

    etj...
    Aeneas Dardanus
    Lavdi, pasthirrme fosilesh, germadhash e rrenojash vershelluese. -Eja pas meje!...

  6. #6
    Super Moderator Maska e benseven11
    Anėtarėsuar
    11-09-2002
    Vendndodhja
    new jersey-usa
    Postime
    10,857
    Faleminderit
    65
    39 falenderime nė 33 postime
    Ku eshte bazuar vendosja e sfondit gri e erret, shkronja te bardha dhe css dhe on click ne jeshile?Ku eshte mbeshtetur ky kombinim ngjyrash?Perse ky kombinim?
    ≈♥♠♣♦≈

  7. #7
    Desert Eagle Maska e 'MAGNUM'
    Anėtarėsuar
    22-05-2009
    Vendndodhja
    Gefangen in Raum und Zeit
    Postime
    140
    Faleminderit
    0
    0 falenderime nė 0 postime
    Citim Postuar mė parė nga Baptist Lexo Postimin
    Me vjen keq qe po kercejne, por kjo do te thote se ke prezentuar ndonje gabim ri diku ne kod. Sepse kodi origjinal nuk kercen askund.
    E kisha fjalen per kodin tende qe ke sjellur ketu me larte, edhe ai kercen dhe nuk eshte e mundur ti shikosh fotot sipas qefit tende por duhet ti shfletosh me rradhe, nga e para larte, separi foton e majt e pastaj te djathten e keshtu me rradhe, se per ndryshe ngecet ose nuk te hapen fotot qe ishin para asaj fotoje qe e ke hapur separi, pastaj ne fund te duhet te klikosh dikund jashta fotogalerise qe te mund ti rishikosh edhe nje here fotot. Perveq nese e ke sjellur qellimisht me defekte, per arsye te Copyright, atehere eshte diēka tjeter dhe s'ka nevoje ta diskutojme fare. Une nuk i kerkova fare arsyet e defekteve te lartepermendura, se pertova.

    Me pelqen ajo qe kishe bere me thuresit e skajeve rrethore.
    Vetem kjo te pelqeu ?

    megjithese qeshtja e ngjyrave eshte qeshtje e shijes mendoj se ne prapavi te zeze serish rri me mire ngjyra e se gjelbertes se re se e kuqja, sidomos kur pala tjeter jane te bardha, ndersa kornizat e mostrave te fotografive i ke theksuar me teper se c'duhet.
    Natyrisht, secili shijen e vet, mirpo une i zgjodha ngjyrat rastesisht dhe nuk iu kushtova shum rendesi pershtatjes mes vete, thjesht e bera pak a shum kuq e zi, My favorite color mixture.

    kodi i gjermanit eshte i mire por ka pak teprim ne keqperdorim te html tiketave qe nuk ben te perdoren jashte semantikes se vet, si dhe nuk ka gjetur menyren si ta ndaje css nga html por galeria e tij eshte e paisur me ate qe une kam cekur se nuk e kam.

    etj...
    "Tunde" mire, mledhja "tlynin" per sypri e tjetrat gjuje posht. Ai eshte qellimi.
    Ndryshuar pėr herė tė fundit nga 'MAGNUM' : 03-10-2009 mė 17:02
    Kosova kurre nuk ka patur armik me te rrezikshem se PDK e Hashim Thaqit a.k.a. Hashim Kompromisit.

  8. #8
    Desert Eagle Maska e 'MAGNUM'
    Anėtarėsuar
    22-05-2009
    Vendndodhja
    Gefangen in Raum und Zeit
    Postime
    140
    Faleminderit
    0
    0 falenderime nė 0 postime
    Edhe kjo me poshte eshte njera nga mundesite e shumta, por gjithnje sipas shijes se njeriut:





    Syri eshte njeri nder "pleqnaret" qe vendos per po ose per jo. Nese nuk gabohem.
    Kosova kurre nuk ka patur armik me te rrezikshem se PDK e Hashim Thaqit a.k.a. Hashim Kompromisit.

  9. #9
    Super Moderator Maska e benseven11
    Anėtarėsuar
    11-09-2002
    Vendndodhja
    new jersey-usa
    Postime
    10,857
    Faleminderit
    65
    39 falenderime nė 33 postime
    Nuk zgjidhen ngjyrat ashtu,ne menyre empirike,me hamendje,si duken per syte apo shijet personale.
    Teknikisht eshte nje metode qe percakton kombinimin perfekt te dy apo me shume ngjyrave.
    ≈♥♠♣♦≈

  10. #10
    Desert Eagle Maska e 'MAGNUM'
    Anėtarėsuar
    22-05-2009
    Vendndodhja
    Gefangen in Raum und Zeit
    Postime
    140
    Faleminderit
    0
    0 falenderime nė 0 postime
    Citim Postuar mė parė nga benseven11 Lexo Postimin
    Nuk zgjidhen ngjyrat ashtu,ne menyre empirike,me hamendje,si duken per syte apo shijet personale.
    Teknikisht eshte nje metode qe percakton kombinimin perfekt te dy apo me shume ngjyrave.
    Nuk jam ndonje ekspert i madh i kombinimit te ngjyrave. Ishte thjesht nje ide per zbukurim. E vazhdova me te gjelberten dhe te kuqen pasiqe i kishim zgjedhur me heret. Cilat ngjyra do te pershtateshin me mire ne kete rast ?
    Kosova kurre nuk ka patur armik me te rrezikshem se PDK e Hashim Thaqit a.k.a. Hashim Kompromisit.

  11. #11
    Cursum Perficio
    Anėtarėsuar
    11-11-2008
    Postime
    2,869
    Faleminderit
    0
    0 falenderime nė 0 postime
    Citim Postuar mė parė nga 'MAGNUM' Lexo Postimin
    E kisha fjalen per kodin tende qe ke sjellur ketu me larte, edhe ai kercen dhe nuk eshte e mundur ti shikosh fotot sipas qefit tende por duhet ti shfletosh me rradhe, nga e para larte, separi foton e majt e pastaj te djathten e keshtu me rradhe, se per ndryshe ngecet ose nuk te hapen fotot qe ishin para asaj fotoje qe e ke hapur separi, pastaj ne fund te duhet te klikosh dikund jashta fotogalerise qe te mund ti rishikosh edhe nje here fotot. ...
    Perdorimi i "vizited" duhet ta heqe qafe kete difektin.

  12. #12
    Desert Eagle Maska e 'MAGNUM'
    Anėtarėsuar
    22-05-2009
    Vendndodhja
    Gefangen in Raum und Zeit
    Postime
    140
    Faleminderit
    0
    0 falenderime nė 0 postime
    Citim Postuar mė parė nga javan Lexo Postimin
    Perdorimi i "vizited" duhet ta heqe qafe kete difektin.
    Ne Mozilla Firefox 3.5 po funkcionon perfekt. Ndersa ne Internet Explorer 8 po ndodhin ato qe i permenda.
    Kosova kurre nuk ka patur armik me te rrezikshem se PDK e Hashim Thaqit a.k.a. Hashim Kompromisit.

  13. #13
    Cursum Perficio
    Anėtarėsuar
    11-11-2008
    Postime
    2,869
    Faleminderit
    0
    0 falenderime nė 0 postime
    Citim Postuar mė parė nga 'MAGNUM' Lexo Postimin
    Ne Mozilla Firefox 3.5 po funkcionon perfekt. Ndersa ne Internet Explorer 8 po ndodhin ato qe i permenda.
    Sigurisht.

    Citim Postuar mė parė nga Baptist, Posti #1
    I testuar ne ie6 fx3.5, opera 9x...

  14. #14
    Restaurator Orbis Maska e Baptist
    Anėtarėsuar
    20-11-2004
    Postime
    8,736
    Faleminderit
    0
    Falenderuar 1 herė nė 1 postim
    Citim Postuar mė parė nga javan Lexo Postimin
    Sigurisht.
    Jo jo, kodi im origjinal (nga posti i pare) do te punoje si ne ie6 si ne ie 12!
    Eshte plotesisht "forward-compatible" ndersa per "backward-compatibility" une pa e testuar fare ju garantoj edhe ie5, madje e le te hapur edhe mundesine qe ky kod mund te funksionoje fare bukur edhe ne ie4.01, pra me versionin e lansuar ne Dhjetor te vitit 1997. Ose 12 vjet me mbrapa.

    Modifikimi i kodit te huaj nenkupton edhe mundesine e introdukcionit te gabimeve modifikuesit ne te.
    Aeneas Dardanus
    Lavdi, pasthirrme fosilesh, germadhash e rrenojash vershelluese. -Eja pas meje!...

  15. #15
    Cursum Perficio
    Anėtarėsuar
    11-11-2008
    Postime
    2,869
    Faleminderit
    0
    0 falenderime nė 0 postime
    Magnum, cilin kod po teston ne IE8, kodin origjinal te Baptistit apo ate te modifikuarin me ngjyra?

    Kam idene se IE8 ka pasur probleme me ngjyrat (ne CSS) te cilat transferohen probleme ne rollover, casacding, scalable corners...

    http://msdn.microsoft.com/en-us/libr...82(VS.85).aspx
    Ndryshuar pėr herė tė fundit nga javan : 05-10-2009 mė 15:19

  16. #16
    Cursum Perficio
    Anėtarėsuar
    11-11-2008
    Postime
    2,869
    Faleminderit
    0
    0 falenderime nė 0 postime
    Citim Postuar mė parė nga Baptist Lexo Postimin
    Jo jo, kodi im origjinal (nga posti i pare) do te punoje si ne ie6 si ne ie 12!
    Eshte plotesisht "forward-compatible" ndersa per "backward-compatibility" une pa e testuar fare ju garantoj edhe ie5, madje e le te hapur edhe mundesine qe ky kod mund te funksionoje fare bukur edhe ne ie4.01, pra me versionin e lansuar ne Dhjetor te vitit 1997. Ose 12 vjet me mbrapa.

    Modifikimi i kodit te huaj nenkupton edhe mundesine e introdukcionit te gabimeve modifikuesit ne te.
    Ne se kodi do kishte marre gabime gjate adoptimit me ngjyrave, problemi do shfaqej ne te gjithe versionet fx3.5, ie6 dhe ie8, ndersa kodi origjinal do te punonte ne te gjithe versionet.

    Fakti qe kodi nuk punon vetem ne ie8 le te kuptosh se dicka nuk shkon jo me logjiken e kodit por me CSS ne ie8.

    Megjithate, ne populli javan te falenderoj per punen e sjelle.
    Ndryshuar pėr herė tė fundit nga javan : 05-10-2009 mė 19:28

  17. #17
    IT Professionals Maska e Sirius
    Anėtarėsuar
    13-11-2002
    Vendndodhja
    Geneve
    Postime
    570
    Faleminderit
    0
    2 falenderime nė 2 postime
    Citim Postuar mė parė nga Baptist Lexo Postimin
    Jo jo, kodi im origjinal (nga posti i pare) do te punoje si ne ie6 si ne ie 12!
    Eshte plotesisht "forward-compatible" ndersa per "backward-compatibility" une pa e testuar fare ju garantoj edhe ie5, madje e le te hapur edhe mundesine qe ky kod mund te funksionoje fare bukur edhe ne ie4.01, pra me versionin e lansuar ne Dhjetor te vitit 1997. Ose 12 vjet me mbrapa.

    Modifikimi i kodit te huaj nenkupton edhe mundesine e introdukcionit te gabimeve modifikuesit ne te.


    Ne vend se te ngutesh mu pergjigj ke mund me provu para se te pergjigjesh, kodi ka at gabim edhe aj qe ke sjell ti.

  18. #18
    Restaurator Orbis Maska e Baptist
    Anėtarėsuar
    20-11-2004
    Postime
    8,736
    Faleminderit
    0
    Falenderuar 1 herė nė 1 postim
    Citim Postuar mė parė nga Rrushi_CH Lexo Postimin
    Ne vend se te ngutesh mu pergjigj ke mund me provu para se te pergjigjesh, kodi ka at gabim edhe aj qe ke sjell ti.
    Cfare gabimi - a di ta pershkruash saktesisht?
    Aeneas Dardanus
    Lavdi, pasthirrme fosilesh, germadhash e rrenojash vershelluese. -Eja pas meje!...

  19. #19
    IT Professionals Maska e Sirius
    Anėtarėsuar
    13-11-2002
    Vendndodhja
    Geneve
    Postime
    570
    Faleminderit
    0
    2 falenderime nė 2 postime
    Citim Postuar mė parė nga Baptist Lexo Postimin
    Cfare gabimi - a di ta pershkruash saktesisht?


    Nuk eshte gabim por mospershtatje e IE8
    Aj qe ka cek magnum ne IE8 ndodh edhe me kodin tend (mendova se e ke te kjart tu u bazu ne pergjigjen tende qe ke dhan Magnum).

  20. #20
    Restaurator Orbis Maska e Baptist
    Anėtarėsuar
    20-11-2004
    Postime
    8,736
    Faleminderit
    0
    Falenderuar 1 herė nė 1 postim
    Nuk mund te jete mos pershtatje.
    Ose eshte gabim ose nuk ekziston.
    Ju po thuani qe ekziston - atehere eshte gabim!

    Dhe ky gabim ndodhe se eshte duke u shkaktuar nga:
    <!--[if IE]>
    <style>
    a {outline:expression(hideFocus='true')
    </style>
    <![endif]-->
    Sepse ne kondicional nuk kam cekur versionin, nderkohe qe kodi mund te funksionoje edhe pa te.
    Aeneas Dardanus
    Lavdi, pasthirrme fosilesh, germadhash e rrenojash vershelluese. -Eja pas meje!...

Faqja 1 prej 2 12 FunditFundit

Ruaj Lidhjet

Regullat e Postimit

  • Ju nuk mund tė hapni tema tė reja.
  • Ju nuk mund tė postoni nė tema.
  • Ju nuk mund tė bashkėngjitni skedarė.
  • Ju nuk mund tė ndryshoni postimet tuaja.
  •