4images Forum & Community

4images Modifications / Modifikationen => Mods & Plugins (Requests & Discussions) => Topic started by: Sunny C. on July 14, 2010, 02:20:29 PM

Title: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Sunny C. on July 14, 2010, 02:20:29 PM
Demo: http://test.4images.benny-boehnke.info/details.php?image_id=1

Step 1
Open / Öffne: templates/YOUR-TEMPLATE-DEIN-TEMPLATE/details.html
Search / Suche:
Code: [Select]
{header}Add after / Danach einfügen:
Code: [Select]
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="imagezoom/featuredimagezoomer.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($){

$('#image_id_<?php echo $image_id?>').addimagezoom({
zoomrange: [3, 10],
magnifiersize: [300,300],
magnifierpos: 'right',
largeimage: '{media_src}'
})
})
</script>

Step 2
Open / Öffne: templates/STYLES/styles.css
Search the last / Suche die leztzte:
Code: [Select]
}Add after / Füge danach ein:
Code: [Select]
.magnifyarea{
box-shadow: 5px 5px 7px #818181;
-webkit-box-shadow: 5px 5px 7px #818181;
-moz-box-shadow: 5px 5px 7px #818181;
filter: progid:DXImageTransform.Microsoft.dropShadow(color=#818181, offX=5, offY=5, positive=true);
background: white;
}

Step 3
Open / Öffne: templates/YOUR-TEMPLATE-DEIN-TEMPLATE/media/jpg.html
Search / Suche:
Code: [Select]
<imgReplace with / Ersetze mit:
Code: [Select]
<img id="image_id_<?php echo $image_id?>"
Step 4
Open / Öffne: templates/YOUR-TEMPLATE-DEIN-TEMPLATE/media/png.html
Search / Suche:
Code: [Select]
<imgReplace with / Ersetze mit:
Code: [Select]
<img id="image_id_<?php echo $image_id?>"
Step 5
Open / Öffne: templates/YOUR-TEMPLATE-DEIN-TEMPLATE/media/gif.html
Search / Suche:
Code: [Select]
<imgReplace with / Ersetze mit:
Code: [Select]
<img id="image_id_<?php echo $image_id?>"
Step 6
Download the attachment => Unpack and put the "imagezoom" folder in your root folder
Downloade den Anhang => Entpacken und packe den "imagezoom" ordner in deinem Root Verzeichnis
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Rembrandt on July 14, 2010, 04:17:44 PM
deine demo funktioniert im IE nicht, im FF schon. (attachment)
und den pfad  "/templates/STYLE/details.html" gibt es auch nicht.

deine erweiterte suche gibt eine fehlermeldung aus, aber das scheint ja ein anderer mod zu sein.

mfg Andi
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Sunny C. on July 14, 2010, 05:10:09 PM
Komisch!
Verstehe ich nicht ganz, warum das nicht geht....
Im originalen Zustand läuft es auch im IE: http://www.dynamicdrive.com/dynamicindex4/featuredzoomer.htm
Alle Pfade sind richtig. Kannst du dir was vorstellen?
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Rembrandt on July 14, 2010, 05:24:42 PM
ich nehme mal an das es an den sicherheitseinstellungen vom IE liegt.
hier wird ein code von einer fremden domain geladen, und das lasse ich z.b. nicht zu, b.z.w. glaube ich sogar das es im IE als standard eingestellt ist.

das vermute ich mal.
Code: [Select]
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> installier das script mal auf deiner webseite.

mfg Andi

edit: schreibt das script mal in den header und nicht in den body
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Sunny C. on July 14, 2010, 05:58:57 PM
Beide Varianten funktionieren nicht. Ich verstehe einfach nicht warum. Der IE zickt jedes mal herum. Solch ein Müll jedes mal.
Ich habe die JS auf meinem server nun und auch alles in den header geschrieben! es funktioniert aber nicht!
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Rembrandt on July 14, 2010, 06:01:36 PM
wenn man alles richtig einbaut funktioniert es, schau mal auf meine demo seite.

die style.css mal aussen vor gelassen.....


einen neuen Order im Root mit den namen js/featuredimagezoomer/ anlegen, oder welchen ordner du auch immer verwenden möchtest.
die beiden dateien "jquery.min.js" und "featuredimagezoomer.js" hinein kopieren.

in der header.html vor {if has_rss}

Code: [Select]
<script type="text/javascript" src="./js/featuredimagezoomer/jquery.min.js"></script>
<script type="text/javascript" src="./js/featuredimagezoomer/featuredimagezoomer.js">

/***********************************************
* Featured Image Zoomer (w/ adjustable power)- By Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/

</script>
<script type="text/javascript">
jQuery(document).ready(function($){

$('#imageZoom').addimagezoom({
zoomrange: [3, 10],
magnifiersize: [300,300],
magnifierpos: 'right',
largeimage: '{media_src}'
})
})
</script>

in templates/deinTemplates jpg.html nach
Code: [Select]
<img
das einfügen:
Code: [Select]
id="imageZoom"
fertig.

Interessant wird das ganze erst wenn man den bigmod eingebaut hat :)
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Sunny C. on July 14, 2010, 06:19:05 PM
Aber wo ist der Unterscheid? Nur das die Pfade anders sind!? Das verstehe ich nicht!
Ich habe das jetzt so eingebaut, aber das Problem mit dem IE besteht immernoch, jedenfalls bei mir! Deine Demo Seite läuft da geht es auch im IE bei mir.
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Rembrandt on July 14, 2010, 06:50:54 PM
versuch mal diese version
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Sunny C. on July 14, 2010, 07:16:48 PM
Funktioniert auch nicht! Ich habe auch das Pagepeel raus genommen, daran lag es auch nicht!
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Rembrandt on July 14, 2010, 08:20:37 PM
nimm mal die css styles raus
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Sunny C. on July 14, 2010, 08:33:18 PM
Auch das bringt keine Abhilfe!
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: uli480 on July 15, 2010, 09:35:38 AM
guter Mod, geht bei mir aber leider auch nicht
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Sunny C. on July 15, 2010, 09:41:27 AM
Nach der Ursache wird noch gesucht!
Geht es nur im IE nicht oder auch im FF nicht?
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: uli480 on July 15, 2010, 11:05:35 AM
bei beiden
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Sunny C. on July 15, 2010, 11:11:43 AM
Hast du mal eine Demo?
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Rembrandt on July 15, 2010, 11:59:57 AM
guter Mod, geht bei mir aber leider auch nicht
was geht nicht, auf deiner webseite geht er nicht, wenn du auf sumales demo seite geht, auf meiner funktioniert er nicht e.t.c........
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: uli480 on July 15, 2010, 01:44:19 PM
/edit
Hat sich erledigt, geht jetzt bei mir.

Es lag nur daran dass die ID nicht imageZoom war
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Forfeit on August 17, 2010, 02:40:57 PM
Hello,
Some time ago i have found mod for 4images, which let to zoom image using flash or javascript(i don't remember actually), but when image was zoomed in, users can't save it to their computer or etc. Maybe you know which mod it is?
P.S. Sorry for my bad English.
P.P.S. Thank you.
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: x23piracy on October 26, 2010, 10:30:04 AM
Nach der Ursache wird noch gesucht!
Geht es nur im IE nicht oder auch im FF nicht?

Hi Benny,

klappt das bei mir mitlerweile im IE?
Ich habe den MOD in beiden Varianten ausprobiert und bei beiden streikt der IE.
Das Problem dabei ist nicht das der Zoom nicht funktioniert sondern vielmehr das,
dass Bild nicht mehr angezeigt wird, stattdessen dauerhaft die load.gif grafik...

So kann man damit leider nichts anfangen da der IE leider immer noch so stark
genutzt wird.


Gruß Jens
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Sunny C. on October 26, 2010, 06:21:56 PM
Ich habe keine Ahnung woran das liegt. Im Original Script läuft es auch im IE.
Der IE ist halt extremer Mist, wer diesen nutzt muss halt eingeschränkt durchs Netz Surfen.
Aber mal schauen wann ich wieder Zeit finde!
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Rembrandt on October 26, 2010, 07:02:43 PM
...
Der IE ist halt extremer Mist, wer diesen nutzt muss halt eingeschränkt durchs Netz Surfen.
....
sry aber wenn ein mod nicht funktioniert, ist das eine billige ausrede.

leider kann ich euer problem nicht nachvollziehen,
ich habe den mod nach meiner anleitung gerade wieder eingebaut und er funktioniert reibungslos, auch im IE  8)

mfg Andi
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: x23piracy on October 26, 2010, 07:12:48 PM
...
Der IE ist halt extremer Mist, wer diesen nutzt muss halt eingeschränkt durchs Netz Surfen.
....
sry aber wenn ein mod nicht funktioniert, ist das eine billige ausrede.

leider kann ich euer problem nicht nachvollziehen,
ich habe den mod nach meiner anleitung gerade wieder eingebaut und er funktioniert reibungslos, auch im IE  8)

mfg Andi

Hi,

ich nehme an du sprichst vom IE8?
Komisch wieso haben dann einige das Problem, was ich sehr werkwürdig finde ist
das in meinem Fall das eigentliche Bild schwarz weiss dargestellt und anscheinend leicht aufgehellt bzw. transparent
dargestellt wird sobald man mit der Maus darüber fährt und eigentlich das Zoom Popup sichtbar ist, auf der Grafik
wird der Spinner dauerhaft dargestellt.

Lässt sich das nicht irgendwie debuggen?

Ist auf Kurts Malediven Seite das selbe js in aktion oder was nutzt er da?
Evtl ist das ja eine alternative.

@Benny

hast du eine laufende Testumgebung in der noch keine weiteren MODS installiert sind um das vielleicht
nochmal in einer Neuinstallation zu mit dem IE zu testen?

Der IE ist zwar wirklich Mist aber der MOD führt bei mir dazu das beim Hovern übers Bild in der Details
das Bild garnicht mehr bzw. unbrauchbar angezeigt wird, das kann ich nicht verschmerzen.

Wenn der MOD einfach nicht funktionieren würde ok aber er führt ja zu einer Fehlfunktion.


Gruß Jens
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Rembrandt on October 26, 2010, 07:40:35 PM
....Komisch wieso haben dann einige das Problem, ....
ich zähle im moment nur zwei, dich eingeschlossen, aber egal...

ich habe mir gerade deine Webseite angesehn, ist dir eigentlich klar das du gegen die 4images  Lizenzbestimmungen verstösst?

zitat:
Quote
Bitte beachten Sie, dass der folgende Copyrighthinweis
    auf JEDER Seite die von 4images ausgegeben wird sichtbar
    sein MUSS. Schriftart, Farbe etc. dürfen an die eigene
    Website angepasst werden, der Hinweis darf aber unter
    KEINEN Umständen entfernt oder unsichtbar gemacht werden.
    Auch muss der Hyperlink zu http://www.4homepages.de intakt
    bleiben. Diese Bedingung ist Bestandteil der Lizenz dieser
    Software. Lesen Sie die Lizenz.txt Datei für weitere
    Informationen.

also bitte füge die links wieder ein..

mfg Andi
 
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: x23piracy on October 26, 2010, 10:45:43 PM
....Komisch wieso haben dann einige das Problem, ....
ich zähle im moment nur zwei, dich eingeschlossen, aber egal...


mfg Andi
 

Hi,

ich habe mal in einer simplen html datei den imagezoomer lokal am pc getestet:

Code: [Select]
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="./imagezoom/featuredimagezoomer.js">

/***********************************************
* Featured Image Zoomer (w/ adjustable power)- By Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/

</script>
<script type="text/javascript">
jQuery(document).ready(function($){

$('#imageZoom').addimagezoom({
zoomrange: [3, 10],
magnifiersize: [300,300],
magnifierpos: 'right',
largeimage: '{media_src}'
})
})
</script>

<img id="imageZoom" border="0" src="bg.png" width="800" height="600">

Auch so klappt es leider nicht im IE wieder das gleiche Problem...
Ich muss das mal an einem anderen PC testen.

Bzgl. Copyright eine Frage in einer PN an dich.


Gruß Jens
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Rembrandt on October 27, 2010, 05:16:46 AM
speichere mal  die datei auch lokal ab:
Quote
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: x23piracy on October 27, 2010, 06:55:06 AM
speichere mal  die datei auch lokal ab:
Quote
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

Hi,

das habe ich bereits gemacht.

EDIT:

Das dieses Script hier nicht funktioniert liegt bei mir an der slide.js aus diesem MOD:
http://www.4homepages.de/forum/index.php?topic=26860.msg152100#msg152100

Nehme ich die slide.js aus dem Header laufen javascripte die bislang stressten einwandfrei,
weiß jemand warum das so ist mit der slide.js der Code darin ist relativ kurz aber ich kapiert
nicht wo der Fehler entsteht.

Sieht das jemand?


Gruß Jens
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: Rembrandt on December 01, 2010, 08:14:21 AM
frage, wie oft hast du jquery schon in deiner webseite eingebunden?
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: x23piracy on December 01, 2010, 10:36:40 AM
frage, wie oft hast du jquery schon in deiner webseite eingebunden?

Hi,

du meinst jquery ansich und keinen code der auf jquery basiert?
Kann ich dir ganz genau sagen 1x unzwar in der header.html und
jquery liegt auch lokal (kein hotlink).

Kannst dir ja mal die slide.js ansehen das sind 3 mini functions um
das panel zu sliden, nehme ich das script aus dem header funktionieren
auch so sachen wie der imagezoomer oder andere nette spielereien.

Oder einfach hier der Code aus der slide.js, ich habs auch im MOD
Thread versucht aber ich glaube der Autor ist nur noch ganz selten da
oder garnicht!

Achja der Code (slide.js):

Code: [Select]
$(document).ready(function() {

// Expand Panel
$("#open").click(function(){
$("div#panel").slideDown("slow");

});

// Collapse Panel
$("#close").click(function(){
$("div#panel").slideUp("slow");
});

// Switch buttons from "Log In | Register" to "Close Panel" on click
$("#toggle a").click(function () {
$("#toggle a").toggle();
});

});


MfG Jens
Title: Re: [MOD] Featured Image Zoomer / Bilder heranzoomen
Post by: chamkani.net on February 24, 2013, 03:34:02 PM
Hast du mal eine Demo?

Working Demo: http://pukhtoogle.com/gallery/img-sports-venues-31-chamkani-football-ground---pukhtoogle-703.htm