Hi, ich finde Imageflow genial und in Verbindung mit Lightbox ist es wirklich sehr elegant. Allerdings habe ich das Problem, dass ich ehrlich gesagt recht wenig Ahnung von PHP und JavaScript habe und nicht weiß, wie ich die "Implementierungen", die auf dieser Webseite angeboten werden einbauen soll. Aus irgendeinem Grund nämlich funktioniert die Reflexion bei meinem Server nicht und ich würde deshalb gerne die Reflexion ausschalten, weiß aber nicht, wie... Ich hoffe, jemand kann mir helfen!
Hi Finn, ich habe heute dein ImageFlow entdeckt. Tolle Arbeit! Ich habe versucht es auf meiner neuen Page http://qualle.spacequadrat.de/page/ einzusetzen aber leider macht mir das Layout einen Strich durch die Rechnung. Wie du siehst nimmt der imageflow Container (roter Rand) zu viel Platz in Anspruch. Ich habe im imageflow.css schon die height auf 100px; gesetzt und auch die Bilder kleiner gemacht aber oben ist immer noch zu viel leerraum. Weißt du wo ich das einstellen kann? Irgendwo setzt das JS ja die height auf 408px; Ich verwende als CSS Framework YAML und das CMS ist mein eigenes. Grüße, Pascal
Sorry! Found the problem, I cannot use space in a folder name ;) -Ruud
One more question; I get this error "Warning: getimagesize(http://sus4.ruudjacobs.net/wp-content/gallery/SUS4 Repetitie/IMG_3279.jpg) [function.getimagesize]: failed to open stream: HTTP request failed! HTTP/1.1 400 Bad Request in /customers/ruudjacobs.net/ruudjacobs.net/httpd.www/sus4/wp-content/plugins/nextgen-imageflow/lib/functions.php on line 92" which refers to foreach ($pictures as $picture) { $image = $siteurl.'/'.$picture->path.'/'.$picture->filename; $size = getimagesize($image); $width = $size[0]; $height = $size[1]; what could this be, the pictures are normal sized, normal aspect ratio, exif info present, nothing special whatsoever. Any ideas? thanks again! -Ruud
Hallo bevor's zum Krachen geht wollte ich noch eine Frage losweren. Ich möchte beim Klick auf das Image nicht das Bild angezeigt bekommen (mittels this.url), sondern jeweils eine eigene url laden - das habe ich mit folgendem Code versucht: onClick: function() {window.open(this.getAttribute('url'), '_self');} Dies funktioniert auch beim Firefox problemlos - jedoch bekomme ich beim e-explorer nur das bild angezeigt (wie this.url). Hast Du bzw. hat jemand eine Ahnung, wie man dieses Problem lösen kann? Schon jetzt herzlichen dank und allen einen guten Start ins neue Jahr. Silvester
@ Hans Blaauw: Please read the FAQ: http://finnrudolph.de/ImageFlow/FAQ#license_1
Hi Finn, thanks a lot! I wish you all the best for 2009, thanks for making the script! -Ruud
How is commercial use defined? And what if we would like to use it commercially?
@ Ruud Jacobs: http://finnrudolph.de/Shoutbox/1228034543
Hi Finn, ich habe mein Problem bereits gelöst und weiß nun auch, dass ich hier auch deutsch schreiben kann^^- danke für diesen tollen Code ;-) und einen guten Rutsch. Ber
Hi I'm trying to implement Highslide on imageflow but I can't get it to work. i added the code to the imageflow.js and to the .css, but I don't know where to put it exactly inside the .js. I think I did it wrong because when I click a picture, it says "loading..." but nothing shows up. What should I know that I don't know, what am I doing wrong? Your help would be greatly appreciated! -Ruud
Hello, I have problems with the "installation": The style of my site is made by php - is it possible to load the index.html (with xml-code) about this attribute-assignement? .../index.php?mod=ImageFlow/index.html This assignement throws this error: Parse error: syntax error, unexpected T_STRING in /homepages/29/d34408776/htdocs/ministranten/ImageFlow/index.html on line 1 Thanks
Es läuft :-) 2 Punkte bekomme ich aber nicht gelöst: 1. startAnimation Ich habe imageflow im header Bereich meiner Seite eingebunden und möchte verhindern dass mit jedem reload der Seite die Animation läuft. Also startAnimation: false. Wenn ich jetzt aber nicht mit dem ersten Bild, sonder mit der Mitte anfangen möchte habe ich die Animation doch leider wieder... 2. reflection igendwie zeigt mein imageflow keine bilder mehr, wenn ich refection: true setze. habe aber alle Voraussetzungen php, gd, etc. erfüllt. Kannst du nochmal helfen?!
Multitouch Prototype 2: http://vimeo.com/2433260
@ Finn: No problem, it's still a great piece of software :)
@ Jeff: You're welcome.
@ Lorie: Hehe, okay I got it ;D Sorry that is currently not possible. I designed ImageFlow with horizontal scrolling, for the human view is widescale and european people read horizontal not vertically etc...
@ Finn : Thanks for the fix, I really appreciate it. -Jeff
@ Finn : Well I hope you get the idea :P you can see it in the source of my message! sorry for no being able to format it right.
@ Finn : Oops that should read " positioned as so : * * * *
@ Finn: Thanks for the reply. Well what i want to do is a scrolling like you have but ro position it in a vertical way. Here's an ascii representation: Now: ********** what I would like is to have the images positioned as so: * * * * * It's the way the designer made the layout and the client has approved it. Any tips as how i could achieve this ? Thanks.
Hi Finn, danke für deine Antwort! Ich hatte diese Version für Joomla 1.5 benutzt. http://www.joomlanook.com/index.php?option=com_content&view=article&id=59:imageflow-for-joomla-15&catid=36:miscellaneous&Itemid=59 Denke ich schmeiss das alles nochmal runter und installierees mit deiner Version ;-) Viele Grüße, Chris
@ Lorie: No, that is currently not possible. What do you need vertical scrolling for?
@ Chris: Welche Version benutzt du? Wenn es eine Extension für ein CMS ist, dann kann es gut sein, dass das eine alte ImageFlow Version ist. Ein Link wäre nicht schlecht... ansonsten den Urheber von der Extension fragen, denn mit dem aktuellen ImageFlow funktioniert es so wie du es dir wünscht: http://finnrudolph.de/ImageFlow/Combinations#Highslide
@ psprofi: Oha, mein Fehler. Auf der Examples Seite stand onclick. Habe ich jetzt in onClick geändert. War aber wohl auch die einzige Stelle, denn unter den Options der Dokumentation steht es wieder richtig. War ja dann klar, warum er das nicht genommen hat. Variablen in JavaScript sind CaseSensitive...
Hi i was wondering if it'spossible to use the script in a vertical way (all examples are horizontal). thank you.
Hi Finn, habe sweit alles installiert (die Imageflow Joomla version) und funktioniert auch mit Highslide. ABER Leider öffnet sich bei mir jedes bild direkt in der lightbox, auch wenn es nicht in der Mitte steht. Ich hätte gerne die Funktion, dass es wie in deinem Beispiel zuerst bei ne Klick zentriert und dann mit einem weiteren klick (auf das mittlere Bild) erst die lightbox öffnet. Welche Funktion muss ich anpassen? Lieben Gruss, Christian
alles klar. habs nochmal überprüft. onclick: function() { window.open(this.url, '_blank'); } muss sein onClick: function() { window.open(this.url, '_blank'); } das Click von onClick muss groß. aber danke fürs script
hmm.. sieht irgendwie komisch aus bei dir. Hast du es mal mit allen original Teilen aus der rar versucht? Ansonsten ist das vielleicht auch interessant für dich http://finnrudolph.de/ImageFlow/Examples#Target
keine ahnung??
@ psprofi: Keine Ahnung, hast du einen Link auf deine Implementierung?
img src="img/img1.png" longdesc="http://www.web.de" width="103" height="145" alt="Image 1"
hiho wie bekomme ich es hin, bei klick auf ein bild, eine adresse in einem neuen fenster zu öffnen. onclick: function() { window.open(this.url, '_blank'); } und Was mach ich falsch
Media Player Classic - Homecinema plays 1080p smooth and cpu friendly http://mpc-hc.sourceforge.net/
@ Dragen: Sure, if it does not get too much ;D
Thank you Finn, for your quick reply. I passed the info to my developer and am waiting for his opinion. The ImageFlow truly is the cleanest looking piece I found and will do everything I can to make it work on my site. Do you mind if we bug ya for little help here and there if we need it?
@ Dragan: Sure, you just need to create a php file that creates the XHTML structure with the image tags dynamically. To get the exact structure, please have a look at http://finnrudolph.de/ImageFlow/Installation
Hi There, I'm running a small high-end audio classifieds site (www.theaudioxchange.com) and thought addition of ImageFlow would be a great enhancement and a very pleasant way to view listings if ImageFlow could be made to pull them from a database. Is there an easy way that you know of? Thank you very much and great work on this really cool technology.
@ jeff: I fixed the bug http://finnrudolph.de/Blog/ImageFlow_1.0.3_online_-_Smashed_a_bug
Would it be possible on the main picture zoomed to get a cool ToolTip ? With title, content... like that : http://www.walterzorn.com/tooltip/tooltip_e.htm
@ Cyril: You're welcome ;D What do you mean by "drag n' drop mouse action"? You can grab the slider to scroll all, or you can click an image directly to slide into view... pretty the same in iTunes...
@ jeff: That is a bug (scrollbar in combination with the imageFocusM option breaks the focussed image). And I will have a look into it today. There is currently no other way to extra scale the focussed image.
@ Denis: I would not say, that I am the best JavaScript programmer, but I tried to listen to what everyone wants. And in my eyes the current ImageFlow version is pretty close to "fully customizable" and therefore suits the needs of all the webdesigners out there building the next "killerapplication" ;D
I searched in the web all the script of Imageflow or other I can and yours is the best. Is that mean that you are the best programmer of this type of application ?
Happy Christmas from AKQA: http://www.behance.net/Gallery/Happy-Christmas-from-AKQA/159865
http://www.europeana.eu/portal/year-grid.html - Your "Imageflow" is used by the new European Internet Archive "Europeana"!
Hi Rudolph, thanks for your great script ! Will it be possible in future versions to move from one slide to another with drag n' drop mouse action ? like on the iTunes coverflow ? Many thanks again, Cyril
hello, I'm having issues in Safari and Firefox with the imageFocusM. If its above 1.2 it sends the image off the screen when dragging the scroll bar. Its happening in your example 9 as well. Is there a way to resize the images without using the imageFocusM, and/or a way to fix this? thanks, -Jeff
"The best keyboard on the planet. Period." http://www.daskeyboard.com/
@ anon: have a look at the bottom of the http://youflow.finnrudolph.de/imageflow.packed.js That configuration opens the site in an iframe, but it works like charm.
How might I use/test your Youtube display? Maybe I might use it here > www.easysavannahlive.com/dolphin Thanks, Gene
hi! i am trying to adjust the way highslide works with imageflow. rather than opening the full size image on a click, i'd like it to open a webpage. i've read the highslide docs and changed the imageflow.js to read: onClick: function() { return hs.htmlExpand(this, { src: this.getAttribute('longdesc'), objectType: 'ajax' } ); but I am not having any luck. any ideas? thanks!
Hallo Finn, ich hab dir den Link an deine eMail adresse gesendet da eine veröffentlichung noch nicht geplant ist. Bei dem Link ist es direkt eingebaut,die Extension wurde erstmal zurück gestellt. Danke dir, Gruss Silaz
@ Springcart: What do you mean by that? YouFlow is a webapp as it is...
Hello, I'm just learning about youflow...do you have instructions on how to make this work? Any help you can give would be appreciated!
Hi Finn, is it possible to make imageflow come up and automatically start with an arbitrary image rather than the first one (i.e. I got three images and want image flow to come up with the middle one in focus)
YouFlow is a KillerStartup: http://killerstartups.com/Video-Music-Photo/youflow-finnrudolph-de-a-new-way-to-watch-videos
Hey Finn, now I solved my problem with your script, that appeared to get wider the more pictures I add. I have to tell you that actually my first thought was right - indeed the height of the gallery is influenced by the amount of pictures, at least I think so. But the more pictures get added, the more width a gallery gets- somehow logical. In your JavaScript you define some parameters (about line 300-330), where you use the width of a gallery to define it's height [thisObject.imagesDiv.style.height = Math.round(thisObject.iWidth * 0.338) + 'px';]. I had to change some parameters and now the gallery fits into my page a lot better ;) (but it's a different one, not the one I posted some days ago). Hope it helps you in answering future questions ;)
@ Silaz: Hast du die Extension irgendwo live, damit ich mir das mal anschauen kann?
Hallo Finn, erstmal nen dickes Lob, sehr schönes Script. Ich hab da ein Problem ich schreibe gerade ne kleine Extension für Typo3 es geht soweit alles bis auf die Reflektion, hab es auch ohne Typo3 getestet und Reflektionen werden bei mir nicht angezeigt, auf dem Server läuft PHP 5.2.5 GD Support enabled GD Version 2.0 or higher FreeType Support enabled FreeType Linkage with freetype FreeType Version 2.3.5 Gibt es noch weitere Workarounds zu diesem Thema? Ich hab leider nichts in die Richtung gefunden. Über ein lösung würde ich mich sehr freuen. Gruss Silaz
Hi Wie sieht es den mit den code aus?
Danke fuer den Link Finn. Soweit bin ich leider nicht mit PHP. dafuer bin ich noch zu neu in der Thematik. Mal sehen wie ich das gelöst kriege Jens
@ Jens: Ja, du kannst die img tags mit PHP dynamisch generieren, basierend auf den Inhalt von irgendwelchen Ordnern... http://de.php.net/manual/en/function.readdir.php
Hi, I am hoping to reach a media buyer or someone in marketing for youflow.finnrudolph.de. I wanted to chat about driving traffic to the site. We are a global advertising network with a reach of over 115 million monthly uniques and over 4 billion monthly queries. We have search cpc for .01/click that many of our advertisers use to increase monthly uniques, traffic rankings and to monetize the site. This increases Comscore and Alexa rankings. We provide ROI tracking and can run anything from CPC, banners, pops, interstitials, geo targeting, etc… We can set up a short 5-10 day test campaign with a low budget and run contextual, behavioral, and geographically targeted ads to reach the right audience. Also we will manage/optimize the campaign to achieve your CPA target. No contracts and no minimum media buys, we are very easy to test. You can test our traffic for as little as $25/day. Any help reaching the correct person would be greatly appreciated. Sincerely, David Miller Sr. Media Planner 602.797.8464 (P) | 602.297.4219 (F) david@AdOnNetwork.com www.adonnetwork.com a PV Media Group company www.PVMediaGroup.com
Hi Finn ist es eigentlich mit php möglich bilder aus einen verzeichnis auszulesen und dann per include oder so in die gallerie einzufuegen? Gruesse Jens
@ Sebastian: Thank you for the feedback. Can you please exactly point out what your problem with the downloaded files was? As an insider I am kind of astonished that there is a problem in understanding the structure. There is a index.html and if one looks at the code it includes two files - the .js and the .css - which should lead to the idea, that changes can be made within that files, since there is no css or JavaScript code inside the index.html... That is the way I thought everyone would understand the example.
the tool is great, but you really need to work on the documentation or make the examples better. Not the examples on the webpage, but the ones in the downloaded files. I searched and searched why my example is not showing up and in all white and not scalable in width. At least hint to the settings in CSS, cause if you're in a hurry your script takes too long to understand!!! Otherwise great tool
Ok I see how to get the php code needed but where would it go within imageflow
@ Rob: JavaScript ist not capable to read out directories (which is a good thing ;D) but you can easily programm yourself a php file that creates the image tags based on the content of a directory. Checkout http://de.php.net/manual/en/function.readdir.php
Can this be set up to read a directory of files insteand of having to manually add each image you want
Weapons of Mass Reduction: http://www.mgiesser.com/images/womr_posters_new.pdf
reflections work great in every browser apart from IE, I have applied the PNGfix and the reflections appear as a white faded image but I have a dark background. is there any way round this. Thanks
@ Jens: Bitte ;D
Vielen Dank Finn Manchmal kann die lösung so einfach sein :) Gruesse Jens
@ chris: You are using some strange css stuff in the div with the id 'content' that sets the overflow... why are you using a fixed height anyway? I think that might be the problem... everything else just looks fine.
Hi Finn Vielen Dank fuer deine Muehen. Wirklich Klasse dein Imageflow. Ich hab habe Probleme mit den einbinden der highslide. Kannst du mal drauf schauen? http://nepenthes.se/gallerien/eee08.php viele gruesse Jens
hm...I checked my programming as well - I don't have any relevant 's in my output. I read out the pictures dynamically from a database, but that can't be the mistake...anyway, here's the link, the relevant section is at the very bottom. Thanks! (http://fischereivereintyrol.at/gallerie.php)
@ chris: Hmm.. that sounds as if you have a lot of breaking spaces in your HTML. ImageFlow only crops the image tags out of your HTML to build itself onload and ignores the rest. So if you want it to be really clean, try inserting the image tags without any spaces inside the imageflow div. If that doesn't work I need a link on your implementation to make another suggestion ;D
hey finn, I've got a question: I'm using imageflow with some pictures (approx. 25) and the more pictures I add, the longer my page gets (that means blank white space is added at the bottom below my imageflow, the more images my gallery contains). Have you come across that yet?
vielen vielen Dank, jetzt funktionierts! ich habe jetzt einfach yourInstance mit instanceOne ersetzt und wichtig ist aber noch zu sagen, dass man noch statt var instanceOne = new ImageFlow(); bei der Istanzierung window.instanceOne = new ImageFlow(); schreibt, sonst funktioniert es nicht ;)
@ lauty: *hehe* du musst doch yourInstance durch den Namen ersetzen, mit dem du ImageFlow instanziierst! Also, wenn du noch nicht die Dokumentation gelesen hast, dannn tue dies bitte. Du instanziierst ein ImageFlow Objekt und das hat einen eindeutigen Namen. 'yourInstance' sollte in dem Beispiel lediglich darauf verweisen, dass du da den Namen deiner Instanz hinschreibst... hätte ich vielleicht noch dazu schreiben sollen ;D
--hinzufügung--- bei dieser Methode: <a href="javascript:void(0)" onclick="yourInstance.handleMouseWheel(1)">next</a> ... kommt ständig die Fehlermeldung "yourInstance not defined" hilft dir das vielleicht weiter?
hey finn ... ich will dich echt nicht aufregen, aber da tut sich einfach nichts ... danke für deine bemühungen
@ lauty: <a href="javascript:void(0)" onclick="yourInstance.handleMouseWheel(1)">next</a>
hm wenn ich das so einsetze und dann draufklicke, dann kommt wieder dieser Ladebalken und die Bilder sind wieder auf Startposition ... Hast du da eine Lösung?
@ lauty: Wenn du html posten willst benutze bitte http://centricle.com/tools/html-entities/
@ lauty: <a href="" onclick="yourInstance.handleMouseWheel(1)">next</a>
Ok, danke Finn für deine schnelle Antwort :) Ich war mir nicht sicher welche Sprache du sprichst :D Kannst du mir mal ein Beispiel an diesem a-Tag vorschlagen?: nächstes Bild Was muss in den onclick Teil?
@ lauty: Dann schreib doch einfach auf deutsch ;D Einen Next und Previous Button kannst du mit der Funktion handleMouseWheel bauen: yourInstance.handleMouseWheel(1) ist vor und yourInstance.handleMouseWheel(-1) ist zurück...
@ kAtI: Why do you want to group images? What JavaScript do you want to combine with ImageFlow? Your example link has been deleted. Simply insert a plain URL it will be converted to a link.
hi, sorry I'm not so good in english, I'm German, but here's my question: how can I make a "go on" and "back" button? (when you for example click on the "go on" button the next image comes) thank you for this wonderful imageflow script!
hey, I have a set of related images that I would like to group. In lightbox I do it with a group name between square brackets in the rel attribute. Like here: But how it works in the combination with imageflow? Where I can include the group name in the longdesc-string? thank you for answering!!!
Email address: kathy@allgencompanioncare.com www.allgencompanioncare.com
Can I use the image flow on a commercial site for a hair salon?
@ Pablo: I think this is the only language that ImageFlow generates ;D Check line 303 of the imageflow.js and change the string... The line is inside the loadingStatus() function and highlighted there: http://javascript.pastebin.com/f1563b1ef
Can i change the language (in particular the "loading images" message)? Thnx in advance... Excellent job
"Objectmachines is a collection of processes that generate objects, surfaces and architecture. Some aim to open possibilty spaces of shapes, some visualize otherwise abstract data while others are purely aesthetic explorations." http://the-product.org/?cat=8
Image Evolution - genetic programming with JavaScript http://alteredqualia.com/visualization/evolve/
Getting some coffee: http://www.kawaiinot.com/images/kawaiinot_strip217.gif ;D
@ Rob: The height adjusts itself in relation to the width. If you want an exact size, that does not fit the current scaling relation you need to build a wrapper around the div and cut it with negative top and bottom margins. Search this Shoutbox to get an exact instruction...
how do you adjust the Height of the Box itself I can do it a little based on the width as a percentage any ideas ?
For those who haven't got it already ;D http://ffffound.com/image/173fb9b737c952700736a9348f58c6d9d4649a71
sorry, i've found what the matter was : my brain...
Hi, Can't use imageflow with mootools and json file. I'd like to create dynamic imageflow when clicking on a picture. I've created two json files, i load data with mootools and create the DOM structure. Then i try to initialise an instance of imageflow, attached to a div created from my mootools method and... nothing happens. I've no error in console, and firebug show me a correct dom structe. Need help !
oh ok danke ^^
was für änderungen gibts von 1.0.1 zu 1.0.2
@ Claudia Mundlos: You can send me an e-mail and I can send you the app... But I will not support it, for I have currently no time. You'll get it as it is and have to figure it out by yourself.
I love the youFlow you created!! Amazing! How can we get the code? are you also planning a youflow where we can set the videos to be watched rather than having people search youTube?
NICHTLUSTIG Trailer: http://vimeo.com/1673483
@ RickyDazla: Depends on what exactly you mean. Do you mean the loading of the images displayed with ImageFlow or the images that will be displayed with Highslide? Highslide has an option called preloadImages (check http://highslide.com/forum/viewtopic.php?t=99)
Is there any way to speed up the loading of images when I use the HighSlide combo (besides making the images lower res)?
Finn, The last link you sent solved the problem. I wasn't declaring the location of the graphics folder in the head of my xhtml document. Thank you again for all your help and patience! I'm using ImageFlow for every commercial project I can from now on. I'll be sure to refer everyone I know to you too. And to think I used to be satisfied with LightBox! Hah! :)
@ Bryan: And I think this helps too: http://finnrudolph.de/Shoutbox/1228034543
@ Bryan: I HIGHLY recommend you to read the documentation again. Especially this http://finnrudolph.de/ImageFlow/Combinations#Highslide
Finn, here's my URL: http://crossfitmansfield.bryanblackdesign.com/photo.php
Finn, I'm having some trouble now integrating the highslide into everything. I've put all your rounded corners, fading and captions code into both .js files and updated my CSS as well. Does anything else need to be changed? The image url I'm using is this: Any suggestions? Thanks a million!!
@ Bryan: ;D No problem at all...
Finn, Sorry for all my messages, I've gotten it to work by setting reflectionPNG: to true, and changing the css with the styles from the white background in the link you referenced. Hope I wasn't too much trouble! :)
Finn, I wanted to include the variable I'm trying to pass: ({ ImageFlowID:'myImageFlow',reflectionGET: '&bgc=ffffff&fade_start=20%' }); It seems to be correct. I'm putting this at the bottom of both the imageflow.js and the imageflow.packed.js Thank you again! :)
Finn, After a few hours of sitting here changing the wrong place over and over again I've figured it out. :) I wasn't changing both .js files at the bottom of the scripts. I was trying to change the option defaults! I am however still having a problem implementing the white background. All I see are the alt tags for the images. Thank you for your quick support! Bryan
@ Bryan: If you edited the imageflow.js like this http://finnrudolph.de/ImageFlow/Examples#White_background_color and nothing happens it is very likely, that you're including the imageflow.packed.js in the header of your html (instead of the changed imageflow.js). Have you checked that? If that's not the problem I need a link on your implementation to give you further support...
Hi, I'm having trouble integrating ImageFlow for a school project. The default shows up just fine, but I can not pass variables to reflectionGET and have the change show up on my site. Any variable I enter into the imageflow.js file does not show up. I'm trying to pass this variable '&bgc=ffffff&fade_start=20%' to get a white background. Any help would be appreciated. Thank you for your wonderful work!!
@ Racer: If you want to get beyond the options (http://finnrudolph.de/ImageFlow/Documentation#Options) I suggest, you take a look in the imageflow.js itself. I documented and structured the sourcecode well (I think ;D) and since it is not that big (less than 1000 lines of code) you should be able to get the information you need from it: http://imageflow.finnrudolph.de/imageflow.js
thx, but i've seen this page yet. i supposed a documentation of the real class object (attributes, methods). i want to know, how i can directly call methods and access attributes.
hi finn, nice work. can i find anywhere documentation of the ImageFlow-Object?
@ anon: You're welcome ;D
@finn: ah, i was close.. just had that function in the wrong place.. your solution works brilliantly - thank you, thank you!
@ anon: Hmmm pastebin.com is currently down. You can do the following to let ImageFlow glide to the 11th image by clicking on an "outside" link: Add a link with the id 'clickme' to your html, then add the following line at the end of the domReady() part of the imageflow.js: document.getElementById('clickme').onclick = function() { instanceOne.glideTo(11); };
@finn: figured it out, was just an ID problem i missed! now for my next question: is there any way to create a menu so that a user could click a link and automatically scroll to that imageID? i see in the imageflow.js that the code accepts moveTo and glideTo, so it seems possible. not quite sure how to implement it, though, so any help would be much appreciated. thanks again!
Does anyone succeed in applying the lightbox[group] function ?
@ Filip: Look out for the variable 'jumppoint' - The basic idea is, that you define two jummpoints (read: image ids from which you can see the doubled images on the left or right) and then check in the mainloop, if the next and previous image in relation to the focussed one is bigger or smaller than the defined jumppoint. The jump is then initialized in the handle() function. It's not that simple... I needed around 2 hours until I figured it out. Good luck ;D
HI Finn. I asked you earlier about an infinite version of the imageflow script and you showed me the example from http://petralangemeyer.com/ Im just not able to reverse engineer it! I see the doubled images in the html but i cannot find their "onClick rebindings to the moveTo-function". Could you give me some help on the way?
@ anon: You edited ImageFlow just right. If the loading sign keeps showing and no Highslide JS window opens there is a problem with Highslide! Check out the following Highslide FAQ: http://highslide.com/forum/viewtopic.php?t=606
great script, finn.. one question - i have all the newest files, but cannot seem to get the 'onclick' option to work. i know i am editing the correct .js as any adjustments to other options have the desired effect. i have tested it in every browser with no luck. any ideas on what i might be missing? thanks! (http://tinyurl.com/6dt39b)
I know, I know but my server run under asp only. No php neither aspx. so, I am still dreaming of YouFlow.
@ Denis: PHP or Ruby etc. is always needed since you need something that delivers you the search results from the database running on a server... JavaScript is client based and with it you can't do such things!
Imagine using YouFlow for a cars shop. YouFlow could show either all the 4x4, all the little cars, all the sports cars, or only the cars by color. Etc... Searching only the pictures or videos in its own site. For me, it would be the perfection. Without php.
Fixed some bugs with YouFlow (Scaling and player positioning in Safari and Google Chrome). And now the player content really unloads after clicking on the 'X' - in the previous version you could still hear the video sound in some browsers after closing the player. Happy Watching ;D http://youflow.finnrudolph.de/
Rollerblade Sweaters: http://www.fantasticworld.org/hd.html
@ Denis: Nope the PHP sourcecode of YouFlow is currently not available. (Perhaps if I have some time to clean up the code and comment it well, I'll publish it...) The YouFlow search covers all the YouTube videos... It has nothing to do with my own site. But one could build such a search for other contents than YouTube. . o O ( Need to have a look into the vimeo API ;D )
Finn, are the sources of your youflow mashup are available ? Is you can search only the pictures in your own site or only the movie in YouTube ? Like Theuns, I think that this new code is the next best thing ; better that the coverflow of built with flash.
@ Theuns: Thank you ;D
@ ivan: That question was not stupid since the file somehow got lost ;D I uploaded it again, please recheck http://finnrudolph.de/Blog/Tagged/ASP.NET
Hi Finn, I think your youflow mashup is the next best thing to sliced bread. Excellent job!!!
I have a stupid question.... I can't find the download link for aspx files on http://finnrudolph.de/Blog/Tagged/ASP.NET Thank you......
*Hooray* I made a ImageFlow, Highslide and YouTube Mashup: http://youflow.finnrudolph.de/
It is a missing GD library. If you follow the plain image url the reflect script gives you an error message: http://www.arq.ufmg.br/lagear/wordpress/wp-content/themes/starkers/imageflow/reflect2.php?img=img/img3.png If you pay for your server space I would demand an upgrade/installation of the GD library for PHP.
Hello Finn! i uploaded all the content from imageflow package online. Thats the link for the index.html you provided. http://www.arq.ufmg.br/lagear/wordpress/wp-content/themes/starkers/imageflow/index.html As you can see the images aren't loading, only the captions, but when i click an active caption the image open up. What the hell could this be? Its a matter of server privileges?
@ It isnt working!: You made some mistakes in your XHTML. Please read the installation instructions carefully (http://finnrudolph.de/ImageFlow/Installation) and if it still isn't working copy the unrared files you downloaded on your server and check if that works. Then implement it step by step into your wordpress thing.
Hello!!! Im trying harrrdd to make Imageflow to work but i cant. I made all the instructions you told, but i still have a problem.. See the web: www.arq.ufmg.br/lagear/wordpress the div appear just with the caption of the images and imageflow doesnt loads.
Pimp da chair: http://www.behance.net/Gallery/The-Making-Of/142821
AUDIENCE at the Royal Opera House: http://www.random-international.com/news/2008/10/23/audience-at-the-royal-opera-house.html
I had a javascript error popup at leaving a page containing ImageFlow (on your demo page for example). The error message is "Unable to find member" (or something similar because i have it in french). This occurs at least on IE7. Let me know if you need more information.
@ SeL: What exactly was your problem with the IE, which symptoms did it show?
Thanks Finn for your script. I had a problem with IE in unload function. I disabled it for IE, and it works fine. Around line 243, i changed the function with the following: window.onunload = function() { if (navigator.appName != "Microsoft Internet Explorer") { document = null; } }; It disables for Internet Explorer, but i didn't notice any change. HTH.
@ Filip: No that is currently not possible. And I think it will break the aesthetic... in my opinion ;D
Hi again, thanks for showing me the infinite version, i will have to look into that a bit further since im not that good of a coder:) Another thing im wondering s if its possible to modify the script so that i can change the 'imageFocusMax' value for each side individually? It would then be possible to have for example 1 image on the right side of focus, and 4 on he left. Thanks again for this awesome script!
@ Denis:Do you have the latest Flash Player installed? http://get.adobe.com/de/flashplayer/ (The reason, why ImageFlow is NOT Flash based: You do not need to install any ugly plugins ;D)
I do not see the video after click on a picture for Imageflow 1.0.2 highslide you tube. But, I am dreaming of a Imageflow version able to search on its own site with keyword the pictures. ImageFlow is amazing.
@ Sebi: Ah, now I got it ;D Very nice idea. Easy AJAX implementation will be the next thing for ImageFlow. I am currently thinking of an 'endless' ImageFlow which preloads and unloads images on the fly to browse > 1000 images without any performance drop. Would be nice for this thing http://testground.finnrudolph.de/software/ImageFlow_1.0.2_Highslide_YouTube . o O ( But the YouTube API is sooo slow... )
@ Filip: I did that once for a client... not that easy and I think it comes with some performance loss. What you have to do is doubling the first and last images within the focus scope and rebinding their onclick events to the moveTo function, which shifts all images to the doubled end or start. You can reverse engineer it from http://petralangemeyer.com (uses version 0.9 so adapting it to the latest version would be cool)
Unfortunatly not usable in IE yet...
Just a little example for triggering ajax requests with imageflow: http://code-labor.de/playground/imageflow/
Love this script! I would like to make my imageflow infinite, so that when ive scrolled to the last image the first one shows up again so i can continue to scroll. Would that be possible to do?
@ Jonathan: You are using an old version of ImageFlow at http://www.jmdezign.com/jouvence/produit.html. Please use the latest version and also have a look at: http://finnrudolph.de/ImageFlow/Combinations#Highslide
Hi Finn, thanks for your script, actually am doing a website and am using a combination of Image Flow and Highslide. works pretty good with Firefox but with Internet Explorer, the images are loading only half the pop-up windows. Any idea???? You can see the works at www.jmdezign.com/jouvence
Does anybody know how to create 'slideshowgroups' for Highslide in combination with ImageFlow?
Hi Finn! E.g. loading picture related content via ajax after the magnification animation has finished. Or even to trigger the ajax request before the animation starts and display the result afterwards.
@ Sebi: Can you name a practical example for this event triggers?
I love your Imageflow-Script! Wouldn't it be nice to have afterFinish and beforeStart events? These could be easily implemented into this.animate and would be helpful to trigger actions outside imageflow. Regards, Sebi
@ Sophie: Hi, please read the Documentation carefully http://finnrudolph.de/ImageFlow/Documentation (it's not that long) and then alter the code in the imageflow.js
Hello, I've passed all night to search on web and finally understand how to put a (domain) url link for an image in ImageFlow but... (there's always a but^^) I can't find where I've have to put the code which is on the example 19 - Target a new windows. May I have to put it in the imageflow.js file (and where ?) or directly in Dreamweaver (in the source code of the page and where) ? Please... help me... Thank you. (Sorry for my non-fluent english, I'm french and very newbie on script code also).
Sorry, I should have know the tag won't show up, I was trying to mention the beginning head tags and closing head tags?
Finn, Do I just put the coding in the layout code like, the first set in ?
One gets the idea: http://www.youtube.com/watch?v=8-AJnLMzE0k
@ Graham: Check line 375 following in the imageflow.js try altering the image.pc and image.pcMem variables to 100. That should scale alle imageformats in the same relation. But I think you will run into problems centering the images and that is the reason why I used different scalings. (I think...) At the moment you can only scale the centered image. Generally scaling is handled in relation to the width of the ImageFlow div container. So if you want the centered Image exactly the size of your thumbnail you have to iterate the one ImageFlow width that fits...
@ James: If you can follow these steps with your blog service Blogger I see no problem why you could not use ImageFlow: http://finnrudolph.de/ImageFlow/Installation
I have found out how to alter the displayable size of the central image but if I am displaying a set of thumbnails (108x72) and set imageFocusM: 0.6 the central image is now smaller than the ones to the left and right. How do I correct this, please?
This a wonderful package but I would like to know a) how can I ensure that portrait images which are the same height as the landscape images are not displayed taller, and b) how do I alter the displayable size of the central image? Thanks.
Finn, I am a Blogger User ;)
@ James: Are you a Blogger user or a developer? Because I don't know if you can manipulate the head section of your blog...
Finn, is it possible to use ImageFlow with Blogger?
@ Dale: Sure, why not? As long as a site is not commercial (http://finnrudolph.de/ImageFlow/FAQ#license_1) ImageFlow ist free of charge. Thank you for the backlink and it is really a nice app!!! . o O (Would be great if Google makes the plugin cross-browser compatible.)
I'd like to use ImageFlow in my 3dSkiMaps for GEPlugin webapp if I may: http://3dskimaps.com/ge Excellent work, it's lightweight and responsive.
Minority Report Interface has arrived: http://vimeo.com/2229299
@ gattaca: You're welcome ;D
great... it worked :) thanks Finn!
@ gattca: Have a look at the Highslide JS FAQ: http://highslide.com/forum/viewtopic.php?t=606 Especially point 2 could be the reason...
Hi, maybe I am too stupid. But hightslide doesn't load - or better: It's loads endless ... Any idea? http://www.stevens-photography.de/fotograf_studio_models/ Great script! Of course I will donate, if it works ;))
@ Finn: Yes, that solved it! I had tried that before, but it didn't work... I had also tried moving reflect2.php to my / directory instead of /imageflow. Doing that, in conjuction with the fix you just recommended, solved it. (if I move reflect2.php back to /imageflow, it doesn't work again). Any any case, it's all good. Thanks!
@ Jaq: That's fine ;D
@ Andew: You pass the image location via the src attribute of the img tags. You just made a small mistake by linking to the images. Leave the ../ away and it will work: http://luxiouslabs.com/reflect2.php?img=images/screenshots/1-Categories.jpg&bgc=ffffff&fade_start=20% is NOT equal to http://luxiouslabs.com/reflect2.php?img=../images/screenshots/1-Categories.jpg&bgc=ffffff&fade_start=20%
Finn - Imageflow is awesome! I just purchased a license for my site. I've gotten it working, but I'm not able to get the reflections processing going. I'm running PHP 5+ and have GD installed. I tried running the script manually from my web browser, and it processed the test image I gave it. So I think it's just a matter of getting the file structure correct? Right now all my imageflow files are in /imageflow and my images are in /images/screenshots. How can I tell imageflow and reflect2.php exactly how to find everything? It's installed here: http://luxiouslabs.com/screenshots Thanks!
Thanks for your advice. Ik fixed it on this way: http://javascript.pastebin.com/f5aef16d6 so I am temporarly glad. :)
@ Jaq: Yes, that will be a feature of the next version... and also a customizable scroll bar... But currently I don't have much time for programming. If you want to give it a try by yourself check this out: http://finnrudolph.de/Shoutbox/1225356607
Hi, this week I implemented your imageflow script without reflections and I really like it. I have read in you faq that it is impossible to slide it auto every x seconds. Do you have some plans to add it in the short future? By the way, thanks a lot for your script! :)
@ Daniel: Das ist keine dumme Frage, muss man selbst erstmal drauf kommen ;D Guck mal da http://de.php.net/imagelayereffect und der erste Kommmentar dazu. Scheint wohl ein Problem mit dem PHP Package deines Servers zu sein. Wenn du Geld fürs Webhosting bezahlst, dann fordere doch einfach mal ein Upgrade ein...
wenn ich das Exit bei der Versionsprüfung auskommentiere kommt: Fatal error: Call to undefined function imagelayereffect() in reflect3.php on line 339
Hi Finn Gut, das Script sagt mir meine GBLib ist zu alt. Eine Nachfrage auf meinem Server sagt aber libgd2-xpm (>= 2.0.33). Sorry, wenn ich so blöde Fragen hab :)
Hot stuff: http://www.red.com/epic_scarlet/
@ Chris Allen: You're welcome ;D
Hi Finn, No problem at all, I am very happy how you have done the script - that was just an extra option were it possible. Thank you.
@ Daniel: Wenn du die URL des Bildes direkt im Browser aufrufst, dann spuckt dir die php Datei (wahrscheinlich) aus was ihr nicht gefällt... Dazu einfach rechte Maustaste auf das nicht vorhandene Bild und "Grafikadresse kopieren".
Was kann das Problem sein, wenn ich (trotz PHP5 und GD Support) keine Bilder mehr seh sobald ich reflectionPNG auf true setze? Ich wollt jetzt nicht den ganzen Code durcharbeiten müssen. Vielleicht kannst mich zumindest auf ne Spur bringen. Danke im Voraus Daniel
@ Chris Allen: I understand what you mean. Something like the 3D effect in Apples CoverFlow. I'm sorry, that is not possible with ImageFlow, since JavaScript (as I use it) is only capable of doing 2D stuff...
Amazing. I have wanted to be able to display my family photos in a unique and great way and this is it. Thank you for developing this and above all for sharing it with us. Is there any way to make the images either side of the main image at an angle? Both sides facing in slightly towards the main image? So only the center main image is face on each time. Hope I have explained okay. Thank you so much
Toshiba Timesculpture Advert: http://de.youtube.com/watch?v=JYPn1BrTNCE
@ reena: I can't rebuild your problem. If I use a apostrophe in the caption it will be displayed including everything after the ' ... Can you paste a link on your implementation, please?
Hi Finn, i have try to encode using the link on http://finnrudolph.de/ImageFlow/FAQ#Implementation_6 but its not working. Im trying to display "reena's home" in the caption but it just showing reena... its not displaying anything after an apostrophe ' .
@ elipse image: You need to activate transparent reflections by setting the reflectionPNG option true. That forces ImageFlow to save png images with reflections and as we all know pngs can handle transparency. Have a look at http://finnrudolph.de/ImageFlow/Examples#Transparent_reflections
how can I leave transparent background in elipses images without a black rectangle behind the image?
Also very useful with a 30 inch display ;D http://testground.finnrudolph.de/temp/ImageFlowHighslideJS_30.png
@ reena: Please have a look at http://finnrudolph.de/ImageFlow/FAQ#Implementation_6 (especially try the link ;D) I would highly recommend using the latest ImageFlow version for compatibility reasons!
Hi guys, im new to javascript... Im have implimented a gallery with imageflow 0.9 and i'm having an issue with the caption. The caption is truncated when it contain an apostrophe. How can i solve this issue? Is this is solve in the imageflow 1.0.2?
Highslide *hooray* ;D http://finnrudolph.de/ImageFlow/Combinations#Highslide Installation text is coming soon...
ImageFlow 1.0.2 has been released. just a small one, with some refactoring and a new (very handy) option called "onClick". Now one can easily manipulate the onclick behaviour/target: http://finnrudolph.de/ImageFlow/Examples#Target
@ Bernd: Please, READ the Documentation http://finnrudolph.de/ImageFlow/Documentation
@Finn: thanks for your answer. Do I have to edit the options in imageflow.js? But than I am not able to use imageflow.packed.js? Or am I wrong?
@ Bernd: Have a look at http://finnrudolph.de/ImageFlow/Documentation#Options the option you are looking for is http://finnrudolph.de/ImageFlow/Examples#No_reflections concerning the arrow keys: They currently only work with the IE and Opera, for I tried to enable them onmouseover. But that was kind of too complex. I will enable the 'old' key support for the first instance on a page in the next version...
@Finn: today I tried the new version 1.0.1 and now I have two questions 1) How can I override the default-values? I would like to override the reflections property, because I don't use imageflow with php 2) I use Ubuntu 8.10 and Firefox 3.0.3 and the arrow keys doesn't work anymore. I tried this with my website and with your example-webseit
@ JoeyBottle: You can do it even nicer by using small images with ImageFlow and redirecting the users to the BIG image. You then need a thumbnail and the original version. Cause this seems to be a frequently asked question I made a FAQ entry on how to open a link in a new window: http://finnrudolph.de/ImageFlow/FAQ#Implementation_12
@ FINN: Ok. I found how all this does work: We can define the relative path (from DocumentRoot) of reflect php script in line 158 of imageflow.js. THEN the paths of the images in index.htm have to be relatives to the reflect php script place. Now all work fine. Maybe, could you explain this to your documentation page, Finn ? This does not fall within the meaning. Regards.
I really love image flow, but I have a question. I want to ue right from the start big images, like 800x600 or bigger and then i just make them small with "width" and "height"..- so why use BIG images ? Because i want it like the use could click on one of the images and then a NEW Windows (without options) appears and shows the image in full size..how could i do this ??
@ FINN: I tried your suggestion but it does not work, even with your archive. Here is my configuration: I put your archive in the «test» sub-directory of my DocumentRoot. Then I put «reflect2.php» and «reflect3.php» in «test/php/». So I change the line 158 like that «src = '/php/reflect'+version+...» or like that «src = 'php/reflect'+version+...» or like that «src = 'test/php/reflect'+version+...» or «src = '/test/php/reflect'+version+...» or anything else... Nothing works except your default configuration. Thank you in advance for your help
How to make fractals without a computer: http://www.youtube.com/watch?v=Jj9pbs-jjis
@ Pascal: First of all: Thank you for the nice Feedback ;D You can set the path to the reflect2.php inside the imageflow.js in line 158. By default it assumes, that the reflect2.php is in the same directory like the index.html. If you use ImageFlow in different directories you can simply set an absolute path...
Hi Finn, First at all, I want to thank you for your job. Your imageflow is for me the most beautiful image gallery I found on the web. It is superb ! Well... I'm using imageflow with eZ Publish and I can't use the reflect PHP scripts because then the images are not loaded. I have try to put these scripts to the root directory of the installation of eZ Publish, to the root of my webserver (DocumentRoot), in the same directory of the imageflow.js javascript...but unsuccessfully. If I put your download archive in a specific sub-directory of my eZ Publish installation, all works fine. But when I insert imageflow in a template of eZ Publish the system does not seem to find reflect2.php. Help is welcome Regards Pascal
Does anybody know how to create 'slideshowgroups' for Highslide in combination with ImageFlow?
Whiteboard PONG ;D http://www.youtube.com/watch?v=azP-1Ja1GLc
Augmented Reality in Fine Arts: http://www.pablovalbuena.com/
habens mittlerweile hinbekommen, wir hatten zuerst eine alte version, die nicht als klasse geschrieben war... mit der klasse ist ein nachträgliches initialisieren kein problem mehr :)
@ IFU: Meinst du mit Layer, dass es nachträglich via AJAX in die Seite geladen wird? Vielleicht reicht es schon zu überprüfen, ob in diesem Fall die domReady() funktion überhaupt greift... Da ich keine Ahnung habe wo es genau hakt (ein Link auf die Implementierung wäre hilfreich) kann ich auch keine genaue Zeiteinschätzung geben...
@ Ralph: Nein. Das funktioniert derzeit nicht. Was man versuchen könnte ist nach dem Update der HTML Struktur das ImageFlow Objekt komplett zu löschen und neu zu instanzieren. Wofür benötigst du das? Wäre prinzipiell ne feine Sache, wenn man immer 50 Bilder vorlädt und nach hinten 50 bereithält, um beliebig große Bildarchive zu durchscrollen ;D
das ImageFlowscript funktioniert in der ursprungsversion nicht, wenn es in einem Layer geladen wird. (ajax..) ist es möglich zu schätzen wieviel aufwand der umbau ist?
Hallo Finn, ist es möglich weitere Bilder während der Laufzeit einzufügen?
Perfekt, vielen Dank.
@ Andreas: Der IE will, dass der wrapper div auch noch position: relative; ist... IE eben. Ist auch arg in der Höhe gestaucht das ganze. Da weiss ich gerade auch keine besser Lösung... sieht gut aus.
Hallo Fin, hab mittlerweile ein wenig herumtesten können (vgl. http://imageflow.andreashofelich.de). Dabei sind mir allerdings zwei Dinge aufgefallen: 1. Während ImageFlow mit den von mir gewählten Parametern in Firefox (wie sollte es auch sonst sein), ordnungsgemäß dargestellt wird, wird der div-container im Internet Explorer "gesprengt". Gibt es dafür eine Erklärung? 2. Ich musste einen kleinen Trick anwenden, damit die Bilder am oberen Rand nicht abgeschnitten werden. Hierzu setze ich PNG`s mit transparentem Hintergrund ein, deren Leinwand um einiges größer ist, als das tatsächlich dargestellte Bild. Beispiel: Das darzustellende Bild hat eine Größe von 90x90px, die tatsächliche PNG-Datei eine Größe von 150x150px. Damit die Bilder nun im Imageflow nicht allzuweit auseinanderstehen, habe ich zusätzlich den Abstand der einzelnen PNGs über den xStep-Parameter verändert.
How to force Mozilla Thunderbird to store all e-mails from an IMAP server locally: https://bugzilla.mozilla.org/show_bug.cgi?id=329229#c18
Vielen Dank für den Hinweis, werd's in den nächsten Tagen mal testen und melde mich dann wieder.
@ Andreas: Dir ist aber schon klar, dass du anstelle der 10% in "margin:-10% 0;" jeden beliebigen anderen Wert einsetzen kannst oder? Damit kannst du ImageFlow auch auf 700 x 1px skalieren. Versuchs mal mit margin:-Apx 0 -Bpx 0; und ersetze A mit dem Kram den du oben weghaben willst und B mit dem für unten.
Hey Finn, dein ImageFlow-Script ist einfach beeindruckend. Vor allem die Tatsache, dass das ganze ohne Flash auskommt, begeistert mich sehr. Eine Frage hätte ich allerdings: Du schreibst in deinem FAQ, ImageFlow skaliere sich - und somit auch alle Bilder - dynamisch in Relation zur Breite des div-containers. Ist es dennoch irgendwie möglich, die Darstellungshöhe zu verändern, ohne gleichzeitig Breite einbüßen zu müssen? Zwar funktioniert der Trick, ImageFlow in einen weiteren div-container mit "overflow:hidden" zu packen und für den ImageFlow div-container "margin:-10% 0" einzustellen. Das reicht bei dem von mir geplanten Einsatz (Darstellung soll ca. 700 x 200px betragen) aber bei weitem nicht aus.
Oh me, oh my. I realised about 5 minutes after my earlier message that the CMS wasn't including the imageflow.css file anywhere and that I've been seeing a cached version of it! Ignore me! Thanks for your help. Will drop you a mail regarding the license.
@ George Hazlewood: Sounds like a css problem. Make sure, that all images within the imageflow class are position:absolute; - that is set in the imageflow.css at line 12. Also check if you set the image position somewhere global, which overrides the imageflow settings.
@ Score Communications: You got an mail.
Hey Finn, Am working on a site with your script at the moment and for some reason imageflow has started appearing with the images showing vertically. Any ideas? Thanks for the script much appreciated, will be buying a license shortly as it's on a commercial site.
@ Timo: All ImageFlow versions prior to v1.0.0 are freeware. But since version 1.0.0 it is licensed. Still free for non-commercial use, but you have to pay a fee for commercial use. If you use any version prior 1.0.0 you do not need to pay for it.
Just read your licence conditions. I thought ImageFlow is free for personal and commercial use? Or did that change with version 1.x? Do i have to pay if i'm already using IF (0.8) on my website? I still have no PayPal account (and had no reason to date to create one).
Sorry! I meant Finn!
Hi Tim, Great Script, thanks for putting it online. Just messaging to ask if its possible to scroll to an image by hovering instead of clicking, and where in the javascript would we look to make that change. We'll be in touch to get a commercial license from you if we can confirm that this is possible. Thanks! Ali - Score Communications nali@scorecomms.com
Ich kann nun nicht wiklich behaupten, daß ein Forum keinen Wartungsaufwand bedeutet. Schließlich walte ich selbst als Mod oder Admin in mehreren Foren. In Punkto Übersicht wäre es jedoch ein unglaublicher Gewinn. Man denke nur an eine komfortable Search-Funktion, ein Unterforum für Feature Requests, eines für Modifikationen, FAQ. Außerdem schützt ein Anmeldezwang mitunter vor den komplett unmotivierten Fragen...
@ Timo: Ich habe mir auch Gedanken über ein Forum gemacht, aber das müsste ich ebenso wie diese Shoutbox pflegen. Und es ist die Frage, ob man einen zusätzlichen Service (Forum) anbieten sollte, wenn man ihn nach drei Monaten wieder abschaffen muss... (wg. zu großem Wartungsaufwand). BTW: auf Englisch müsste das Forum so oder so sein ;D Ich werde nochmal in mich gehen und überlegen, ob ein Forum wirklich besser (weniger Wartungsaufwand für mich, mehr Support für die ImageFlow NutzerInnen) ist.
@Finn: Ich denke, daß dieser persönliche Support für jeden Einzelfall Dein schönes Projekt irgendwann zerstört. Audiograbber ist zum Teil auch deshalb "gestorben", weil der Programmierer von einer E-mail Flut überrannt wurde und irgendwann einfach keinen Bock mehr hatte. Mach ein Forum auf und lass ein paar von den erfahreneren Nutzern den Neulingen helfen. (Himmel, ich bin schon total verkorkst: Hatte den Text doch tatsächlich zuerst auf Englisch getippt!)
@ dipa & Alejandro: You got mail ;D
How can I reduce the size of imageFlow? I want it to be for example 100px tall... Email me at admin{at}djs-music.com
hi i would like to use this on a commercial website. What can i do? contact me on dipa 84 at gmail com
Hi Finn would you mind if i emailed it to you? leev_21@yahoo.co.uk
@ Lee: Can you please post a link on your implementation?
Hi Finn, Ive added 'position:relative;' to the wrapper div but it still doesnt show in IE. when i click refresh, you see the loading bar appear but then it disapears.
@ Benek: You also have to set the option "sliderWidth" to pass the value to the JavaScript. Have a look at http://finnrudolph.de/ImageFlow/Documentation#Options
Hi Finn, great script. If I change the slider image to be wider than 14px, what do I have to update so that it doesn't slide too far off the end of the slider line? I changed it's width in the CSS but that didn't do it.
@ lee: Oups my/Microsofts fault ;D You also need to set the position of the wrapper div relative like: position:relative;
Hi Finn, Ive managed to chagne the height, thanks. Just noticed it works in all browsers apart from IE.?
@ Simone: Hmmm cookies might just work well with JavaScript ( http://www.quirksmode.org/js/cookies.html ) You then need to add the saving of the current image id to the cookie on the click event (BEFORE the image opens). And you need to add a function that checks for any variables set in the cookie on pageload... To start with a special image ID you can use the option startID http://finnrudolph.de/ImageFlow/Examples#startID
@ Lee: Please read the FAQ ( http://finnrudolph.de/ImageFlow/FAQ#Implementation_7 ) and the workaround to manipulate the height of the imageflow div http://finnrudolph.de/Shoutbox/Archiv/2008#1224710261
@ WBP.Designs: You got an e-mail...
Hi, first thanks for creating this script .. I'm a newbie about javascript. I'm thinking about using imageflow for my personal website but I cant find out how get back to the image when you get back to the gallery. An example ... Viewing a gallery , scrolling to image N. 12 , clicking on the image , viewing image 12 at full size , hitting the BACK buttono on the browser ... and you get back to the galler BUT at the starting point I was thinking about saving the "current image" int a cookie so when you hit the back button the gallery start in the same position What do you think about it ??
Thanks for creating that great image flow script, it is one of the best gallery scripts we have seen. I am writing this to seek permision to use Imageflow for a website that we have been designing. We have a client who is starting a small graphics design website, and we would like to be abel to use your ImageFlow script within the website. The site itself will not be related with e-commerce or anything like that. Its just a simple graphics design website with images being displayed. Please email back to: wbp.designs@email.com Thanks
Thanks for the great imageflow script. Everything works fine on my site but i would love to change the height at the imageflow div. How do I change the overall height because its currently far to big for the layout of my site. Thanks
"The Coffee Problem" made me laugh ;D http://lbrandy.com/blog/2008/10/algorithms-in-real-life/
@ luchs: first of all the answer: http://finnrudolph.de/ImageFlow/FAQ#Implementation_10 ;D But you can build it easily by yourself. The Method handleMouseWheel(delta) is your friend. Use yourInstance.handleMouseWheel(1) to slide to the next image and yourInstance.handleMouseWheel(-1) to slide into the other direction. That combined with a timeout and voila, a slideshow. Simple example: http://javascript.pastebin.com/f59dc8994
Hallo, i'am searching for a slideshow funktion of this great script. Is there a possibility to redo the "/* animates image gliding */" after a pause of x-seconds? So that it automatic glides into the next Image.
@ Bill: Scaling is in relation to the width of the ImageFlow div. Increase it and all images will get bigger. If that is not possible due to your design you can still force the centered image to be bigger by using the imageFocusM option: http://finnrudolph.de/ImageFlow/Examples#imageFocusM
Hey Finn! Love your work. Having a trouble increasing the size of ALL images. I've tried everything and can't get them bigger than 245x245
@ Eric: You can increase the size of the centered image ( http://finnrudolph.de/ImageFlow/Examples#imageFocusM ) and combine it with an increased xStep ( http://finnrudolph.de/ImageFlow/Examples#xStep )
Finn – Thanks of an excellent script. I would like to increase the image size without overlapping the borders. Any suggestions. http://www.wildlife.co.za/library/mammals/Impala.htm
@ Ternog: Oups, yet another absolute link... try this: http://software.finnrudolph.de/ImageFlow_0.9_Lightbox2/ImageFlow0.9_Lightbox2.rar But please be aware, that this is NOT the current version of ImageFlow!!!
Hi, It's a very nice piece of code your ImageFlow. I would like try it with lightbox2, but your link is dead : http://194.95.111.244/~countzero/scripts/_myImageFlowLightbox2/ImageFlow0.9_Lightbox2.rar Could you solve it please. Thanks a lot.
@ TechGirl: Which IE? What exactly is the error and can you give a link on your implementation?
Hi, great piece of code, one problem though. am getting a runtime error in IE when I click on one of the images
Make sure you check the video: http://www.engadget.com/2008/10/28/face-visualizer-turns-us-all-into-meat-puppets/
@ B: Sorry to disappoint you ;D The space is set to fit portrait scaled images... There should be nearly no top-padding if you use such image formats. But if you use only landscape formats and you want to get rid of the extra padding there is no other way than to put ImageFlow into a wrapper div like described there: http://finnrudolph.de/Shoutbox/1224710261
Hi, I wondered if there is a way to remove the padding between the top of the imageflow div and the imageflow gallery itself. I cannot find the padding in the CSS or any positional information in the JS which corresponds to this gap and want to avoid using negative positioning if possible as I think it is a bit of a hack to your lovely code... Thank you.
@ inputs: You got mail...
is there a possibility to run a slideshow? inputs@gmail.com
Advanced Data Visualization Tools using JavaScript: http://www.84bytes.com/2008/10/22/advanced-data-visualization-tools-built-with-javascript/
Good, gooood ! ; )
@ Hoyt: I'll think of it for the next version...
@Zep: PHP4 is enough.
Image Flow is very cool thanks, I was wondering if there are plans to have a flag that would allow the animation to continue for an animated slide show mode.
Last question.. . is updating the gd library enough or does reflection3.php need a php5 server ? Because we are on php4 and the programmers don t seem keen on changing especially a friday afternoon.. . = )
@ Zep: Thank you ;D
Okay thancks, i ll check out if there are any updates to be done on our gd Library. Need that reflectionPNG set true it could look soooo nice !! :D And i ll talk my boss into donating, your work is top of the line. ; )
@ Zep: Okay that is the problem. You MUST set reflectionPNG to true, otherwise the reflect2.php will return you a jpeg instead of a png and as you know jpegs can't handle transparency. If it doesn't load with reflectionPNG set true the PHP version running on your server is too old for the fancy stuff that happens in the reflect3.php. The following link should return you an png, but it doesn't. If you can fix that you'll have all the transparency you want ;D http://www.chasseurdefrance.com/nuvo_site/reflect3.php?img=img/IMG_8.jpg
http://www.chasseurdefrance.com/nuvo_site/index.html That s the site whit reflectionPNG false otherwise imageflow won t load ! (Menu sections 2 and 3 work if you want to see content ^^,)
@ Zep: Can you post a link to your implementation?
Yop, yeah i realized whit a great deal of pleasure that you don t need flash for everything. - ^, I can t get that example to work, might it be because i have a mixed list of jpgs, pngs ?
@ Zep: Jepp, JavaScript is a 'real' programming language ;D If you want transparency with PNGs (including any transparency in the image) you have to enable it by setting the option reflectionPNG true - http://finnrudolph.de/ImageFlow/Examples#Transparent_reflections
Hallöchen aus paris ^^, Also, great job thancks a lot the programmers at my job are quiet bluffed by your work ! But when using PNG whit transparent parts imageflow fills in the empty parts whit black.. . I tried most examples including transparency but it s not quiet it ! Thancks again, have a nice day Viel glück
@ psprofi: Und wenn du anstatt 10% einen Wert nimmst, der die Bilder nicht anschneidet? Ein Link auf deine Implementierung wäre hilfreich...
jein. Dann sind die bilder oben und unten abgeschnitten
@ psprofi: Hilft das? http://finnrudolph.de/Shoutbox/1224710261
div id="myImageFlow" class="imageflow" style="width:100%;border: 0px;"
Ich nutze dann ist mir aber die Box zu hoch. kann ich das irgendwie ändern? (*hoff*)
sorry, stupid typo - it works fine :)
@ Finn: in the previous version I called js functions from image flow using longdesc="javascript:blah(var);" - this isn't working in 1.0.1, so I was wondering if you knew of an alternative method I could use?
Containership powersupply anyone? http://www.designboom.com/weblog/read.php?CATEGORY_PK=&TOPIC_PK=2868
Make a decision ;D: http://www.godesignate.com/
@ Bill: Put the ImageFlow div into another div with the CSS properties overflow:hidden; Then add a negative margin to the ImageFlow div container like margin:-10% 0; and voila... it is forced to be 20% smaller in the total height.
Hey Finn, really love 1.0.1! It's great. Was wondering how I could remove some of the padding/margin above and below the images? I've tried modifying both the JS and the CSS and nothing really seems to stick.
@ rob: You're welcome ;D Perhaps that is the best solution anyway, for a user can refer to each subsite by an URL...
@ Finn: I'm using 1.0.1 alright. The preload option didn't work for me so I guess I'll split the site out onto separate pages. Thanks a million for all your help, much appreciated !
@ rob: Do you use the latest version (1.0.1)? Then you can try (as a last thing I can think of) the option preloadImages like in the following code: http://javascript.pastebin.com/f614d176f
@ Finn: I added that code block where you specified, but still no luck. I'm getting a "loading bar is null" which refers to this line: loadingBar.style.width = finished+'%';
@ rob: No that is not the problem. Please try the "brute force" method. Change your general.js like this: http://javascript.pastebin.com/f7734d9ce
@Finn : I will try smaller images and see how fast that works on an iPhone... Thanks!
@ nemo: Sorry, I can not test that (lacking an iPhone, BlackBerry etc ;D). But I do not think that there are any performance improvements since version 0.9 - BTW: Performance is limited by the image interpolation of the browsers, not the JavaScript execution time! That means, if you decrease the total images displayed and shrink the image size it should perform better. See also: http://finnrudolph.de/ImageFlow/Examples#imageFocusMax
Finn, I have installed version 0.9 on my site and use it extensively. I adapted imageFlow to suit me, so I am a little worried about upgrading to version 1.01. One reason I would make an effort to upgrade if the latest version runs faster on slow machine (like iPhone, BlackBerry, etc.) with limted CPU power. Thanks for imageFlow, and keep up the good work!
finn: I don't think that the instanceOne.forceRefresh(); is hitting that function - I dropped an alert in and it didn't popup when the ajax ran. I'm running the ajax in a general.js file that is included on the index page, the imageflow.js file is also included on index.php - could this be a problem ?
the Initiate code block [instanceOne.init({ ImageFlowID:'myImageFlow', reflectionGET: '&bgc=D4D1DC&fade_start=20%', startID: 3, startAnimation: true }); });] is breaking my ajax call - hmmm, confused now
@ rob: hmmm... let's try brute force. when your ajax update runs successfully destroy your ImageFlow object and let it rebuild itself from start: http://javascript.pastebin.com/f2a1d2778
still no. sorry about this :(. I added the line of code to the this.forceRefresh function which I declare before the option defaults are set. Then I call instanceOne.forceRefresh(); when my ajax updater runs successfully.
@ rob: D'oh... I forgot that the structure has to be rebuild. Try this: http://javascript.pastebin.com/f44845191
@ psprofi: Eigentlich nein ( siehe http://finnrudolph.de/ImageFlow/FAQ#Implementierung_7 ) aber du kannst via CSS durch margin-top und margin-bottom mit negativen Werten vielleicht das erreichen, was du willst?
@ psprofi: ? ;D
öhm ups ^^
Hi ich wieder ^^ Kann ich die höhe verringern und die breite erhöhen? wenn ich in der css width auf 40% stelle, wird auch die breite verändert.
of course, thanks. I've added it just after the constructor is opened: function ImageFlow () { this.forceRefresh = function() { instanceOne.firstRefresh = true; instanceOne.refresh(); }; This is better, just the image flow area is refreshing but the images are still not showing.
@ rob: You should add the forceRefresh method inside the ImageFlow constructor(!) not into the domReady part. Open the imageflow.js and have a look at line 37...
yeah I added this: /* Create ImageFlow instances when the DOM structure has been loaded */ domReady(function() { var instanceOne = new ImageFlow(); this.forceRefresh = function() { instanceOne.firstRefresh = true; instanceOne.refresh(); }; instanceOne.init({ ImageFlowID:'myImageFlow', reflectionGET: '&bgc=D4D1DC&fade_start=20%', startID: 3, startAnimation: true }); }); and this: instanceOne.forceRefresh(); after the ajax call. The page refreshes but the ajax IF does not work.
@ rob: Have you tried my suggestion yet?
Hi Finn, thanks for the reply. Here is the link: http://www.dv4.com/demos/paradise/ Images Load up fine initially (not sized correctly yet) - I only have the ajax call on "Television", the first menu option. Thanks, Rob
@ rob: Can you post a link to your implementation? I suggest you add the following method in the constructor ImageFlow: http://pastebin.com/f1bb590c8 and then call yourInstance.forceRefresh(); after every Ajax update of the DOM structure...
I'm trying to ajax my image flow implementation, but it's not working for me at the moment. Ajax is updating the IF div correctly but I think that if IF runs off domReady and that this is probably the problem. However I've not managed to find a solution and any tips would be much appreciated. Thanks
Festo Air_ray: http://www.youtube.com/watch?v=UxPzodKQays
@ Mike: The current ImageFlow Version supports arrow keys with the IE7 and Opera for all instances ;D I'll have a look into a good solution... later...
@ Bill: Can you please post a link on your implementation? (Are you sure, that you included the right/edited JavaScript file? By default the download package uses the imageflow.packed.js version)
Yes arrow key support would be great if it only works if there is one instance. OR do it if you place your mouse over it, but I would prefer the first one.
Yes! Very nice. Set up much faster than last time. The onload event overrides were a headache. Much better this way. Good job! One more thing: domReady(function() { var instanceOne = new ImageFlow(); instanceOne.init({ ImageFlowID:'myImageFlow', startID: 2 }); }); Still starts on slide 1... What am I doing wrong?
@ Bill: Since version 1.0 ImageFlow is unobtrusive. It should not destroy any other JavaScripts. I encapsulated the whole ImageFlow in one constructor and all events are added, that means no nasty onload event overrides anymore. And I changed the CSS, that it only does stuff with the imageflow div content. That means all variables you have to deal with are: 'ImageFlow' and 'domReady' in the imageflow.js plus the CSS class 'imageflow' in the imageflow.css (isn't that beautiful ;D)
Thanks for the fast reply, Finn. Spent a lot of time ironing out conflicts with the other JS... was hoping to avoid doing that again but I'll give it a shot.
@ Bill: Please consider using the latest ImageFlow version. There had been many changes since the version 1.0 and configuring ImageFlow has become very easy with options ( http://finnrudolph.de/ImageFlow/FAQ#Implementation_1 ).
Hey... how do I start at a certain image with imageflow 0.9? I tried modifying current = 0; but that didn't work.
cool (some z-index problems though) http://maettig.com/code/javascript/3d_dots.html
oh sry i saw the answer
how is it possible to use externally images
Details on that release: http://finnrudolph.de/Blog/ImageFlow_1.0.1_online_-_IE_bug_smashed
I released a new ImageFlow version: http://imageflow.finnrudolph.de/
@Mike and @Finn : How about restoring the arrow funcionality if imageFlow knows there is only one instance, and use the mouse focus feature if there are more than one instance?
@ Mike: Yes it was intentional, because I was not sure how to implement it best with many instances. Would it be okay, if you can use the arrow keys to scroll if your mouse is placed over the ImageFlow instance you want to scroll?
@ psprofi: If you set the reflections: false you can add any absolute image URL. I think to use an external image src with the reflect2.php you have to rewrite some of the PHP code...
In the new version of ImageFlow (1.0) the arrow keys cannot be used to scroll through the images anymore! This worked great in 0.9. Is this intentional, and if so, can you add an option to enable this again? It was really useful.
ist es möglich bilder von einer externen quelle zu nutzen??
@ Ritchie: Sizing should work like described in: http://finnrudolph.de/ImageFlow/FAQ#Implementation_7 and yes, there is a lovely IE bug with the ImageFlow Script. I'm looking into it and there'll be a bugfix soon.
Hey there Finn, after loads of searching, I found your script, and am extremely impressed. I have a few problems though. I expected Imageflow to site within the container DIV I created for it, but the images overlap into the rest of the page. I got around it by adding a margin-top to the DIV, pushing the resulting gallery further down the page. Is there a more predictable way of containing Imageflow? I am also having some issues with IE not displaying it at all, but I'll have another look at page before I go into specifics.
@ Thomas: Can you post a link on your implementation. Are you sure, that you included the imageflow.js and NOT the imageflow.packed.js in the header of your HTML document?
@Finn: thanks. but that doesnt work. i tried different open window, but its still opening in the same window. image.onclick = function() { window.open(this.url, '_blank'); } even if i remove this, its still opening in the same window. i tried to put another url, but that doesnt work eather.. any idea..?
@ Marc: Hmmm Google ist auch keine große Hilfe. könnte am HTML liegen (http://www.phpforum.de/archiv_25520_die@Seite@@kann@nicht@geffnet@werden@Vorgang@abgebrochen_anzeigen.html) oder am JavaScript (http://www.joomlaportal.de/joomla-templates/114558-seite-kann-im-internet-explorer-nicht-angezeigt-werden-vorgang-abgebrochen.html). Aber da du ein ImageFlow package verwendest, welches ich nicht offiziell supporte und die Fehlerquelle sehr wahrscheinlich in dem 'fremden' Code liegt, wende dich doch einfach mal an den Urheber des Scripts ;D
Hallo Finn Ich verzweifel langsam, aber sicher. Ich habe mir eine "Lightflow-Gallerie" mit Jalbum gebaut. Beim Laden der Seite mit IE 7 sagt mir der Computer, das die Seite nicht geöffnet werden kann. Bei Firefox, Safari und Opera funktioniert es sehr gut. Die Seite wird in einem Frame hochgeladen und auf meinem computer sieht sowieso alles gut aus. Leider nicht im Netz. www.schultz-coulon.de/test2 (auf "medicine" klicken). Die einzelnen Hilfen im Netz helfen mir leider nicht weiter. Wahrscheinlich ist mein Englisch auch nicht gut genug und ich bin kein Programmierer. Ich würde mich herzlich auf eine Antwort oder Tip freuen. Gruss Marc
@ Liam: u can change background color in css, "background-color:#fff;" to white. u can put this on imageflow div aswel..
I am finding it really difficult to change the background color from black. tried everything i can understand and nothing seems to work
@ Thomas: http://finnrudolph.de/Shoutbox/1219411465 . o O ( I should write that one in the FAQ too... )
Hey.. i need a smal help to open image in a new window.... anybody..?
http://www.flight404.com/blog/?p=131 leads to http://things.sansumbrella.com/2008/10/mcrozinhodgin-dice-mirror/ ... inspiring ;D
@ Ashley: You got a mail.
Sure, I use Yahoo for mail -- dstewart21 -- Thanks! Ashley
I made the feeds valid RSS 2.0 (shame on me I did not do that earlier) http://validator.w3.org/feed/check.cgi?url=http%3A//rss.finnrudolph.de/shoutbox/ and http://validator.w3.org/feed/check.cgi?url=http%3A//rss.finnrudolph.de/blog/
I improved the Shoutbox. Now too long words, that 'overflow' the message box will be hidden via CSS. And the string to link PHP now works as it should. Thanks to this snippet: http://snipplr.com/view/1892/replace-url-with-link/
@ Ashley: Sorry for the delay. There is a small problem, I accidently deleted (read: forgot) the very last shoutbox entries when I moved the page to a new server. Can you please post your mail address again?
Thank you for make it object oriented. Great job. Thanks man.
Hi Finn, Sorry to be so persistent. Do you think it's a possibility to add that custom/scalable scrollbar? I'll definitely donate for your effort. - Ashley
@ nemo: Give me an iPhone (or iPod Touch) and I will think of something ;D If I get my hands on such a thing I will check if there is another solution...
Hi, it's a pity the mouse-wheel functionality or the slider don't work on an iPhone, due to the iPhone's touch-screen GUI interface does not understand the notion of dragging your finger across the screen to mean actuating the slider, or flipping images. This great script, inspired by the cover flow idea don't work so well on an iPhone (a bit of an irony I guess). The only way you could scroll through the images is to tell the user to tap at the next or previous image, and hope it will to move to focus, but does not work all the time, and it is not intuitive... I wish there was an easier way, as I really love imageFlow.
I guess u`re right. )) But is it possible to make faster instances work in normal speed before others are loaded or it`s Opera bug. Thanks
@ Lord Max: Thanks for the bugreport, I'll have a look into it. (I really do love the IE...) Concerning the waiting of faster instances for the slower to load and then display the images: I don't think that is a good idea. In this case object-oriented means independent objects and I like browsing loaded galleries while the others are still loading...
Great job you’ve done. In version 1.0 some bugs found. Major one: in my IE 6.0.2900 - loading doesn’t show (showing blank screen, then I see image by image showing), images quarter sized. In opera: it would be great, if you’d make all instances wait for each other till loading is done cause already loaded ImageFlows act like on old computer ))
@ tabsl: Lies mal die Nr. 7 der FAQ - http://finnrudolph.de/ImageFlo w/FAQ
tach, hätte hier noch ne kleine frage. wo kann man die bildgröße einstellen? es wird das bild was derzeit fokusiert ist immer auf 269xXXX pixel gemacht, obwohls viel kleiner ist.
@ rainer: In der imageflow.js - lies dir auch mal die Dokumentation durch, dann sollte es klar werden: http://finnrudolph.de/ImageFlo w/Documentation Wenn da etwas verwirrend geschrieben ist, dann bitte um Verbesserungsvorschläge ;D
Hallo Finn, wo muss ich die option für die startID einbinden?
Hi Finn, Thanks a ton for your wonderful script.... It rocks...
How can i open a image in new window instead of inside the same window..?
@Daniel. Why the hell did you rip of my site ?? There is a download package with another more simple skin for free. Now you are violating the law and also miss the scripting needed for that version to work.
Carcade anyone? http://tinyurl.com/547uxn ;D
@ Daniel: If you use a modified version of ImageFlow (http://www.imageflow.nl/) ask the author, who did that for support ;D
i load the gallery in an iframe and through iframe on ie 7 is not looking ok. Any thoughts? http://www.viacasa.it/images.p hp
@ TheCelavi: sure, every IE below v7 needs a kick in the ass to display transparent PNGs ;D - http://webfx.eae.net/dhtml/png behavior/pngbehavior.html
IE PNG problem? Anyone?
Douglas Crockford: "The JavaScript Programming Language" http://video.yahoo.com/watch/1 11593
@ Oliver: Have you tried the positioning fix in the FAQ?
Finn, great work! I currently prepare a site with your imageflow-tool (will be freely accessible soon). I made some slight modifications, especially I changed the screen.css in line 10, I put #imageflow in front of the img-tag, as all images in my website got this option, which looked strange. Perhaps this is a recommendation for a next version, or do I miss something (html-tags equipped with #imageflow as well) ? One question: Especially in IE I have problems with centering the slide bar under the picture flow. Is there something I can do about ? Best regards from another former student at CAU Kiel ...
@zees Just checkout the latest imageflow version http://www.imageflow.nl You can use the picasa version since this one works with the latest highslide
Great to hear a new version of ImageFlow is coming... I hope an updated plug-in for HighSlideJS will soon follow (Ceaser? Are you there?)
In response to Dirks problem back in may with the image_array.. I also had this and found that its if you dont have more than 4 images in your list, as the var conf_focus = 4; (the part that sets the number of images either ide of the focussed one) is set to 4 so is looking for 4 images.
There is a small bug in Line 85. Add a 'var' here. Else the IE may run in Trouble. I combined your script with lightbox2: http://tinyurl.com/4bx73w
finn, you are my hero. getting rid of all the whitespace worked! danke! (i'm using CMSMS 1.4.1 BTW)
@ Chris: try http://tinyurl.com/3rvmff
@ craig: Hmmmm... that's a bug. There will be a new ImageFlow version soon. Meanwhile try stripping all whitespaces / blanks between the img tags. Could be that the IE handles that stuff as childNodes...
@ Sven: Link zu deinem Versuch? bzw. ruf mal eine der Bild URLs direkt auf, dann sollte die reflect.php auch eine Fehlermeldung ausspucken.
@ Pierre: Stick to the original css and the images should be hidden on page load.
@ Robert: change the conf_reflection_p to 0.0
Great looking and fast. I have weird thing in Firefox3.03. Sometimes when I slide the slider there is a blue haze over the images as they come around but it clares if i click image.
love the imageflow. great work. one little bug - the last ten image or so don't scale properly in IE7. ??? - http://new.marquisent.ca/
Hi Finn, good works! But I have a problem: the script don't work with the html editor of iWeb 2. Possible? I'm a classical pianist.....If you have a solution you can write to me at info@simeonepozzini.it Thanks a lot
Hi Finn, cooles Skript! Ich bin nur leider anscheinend zu blöd, die Bilder anzuzeigen ... Benutze XAMO, und laut phpinfo() ist gd-support enabled (Version 2.0.34 compatible). Die Pfade sollten eigentlich auch stimmen. Bekomme aber nur ein schwarze Seite mit dem Schieberegler. Offensichtlich wird die reflect.php gefunden, allerdings werden die echo-Ausgaben nicht angezeigt.
10:18 - Pierre (sorry for the link)
http://thierrybischfree.free.f r/Francais/new_%20flowers.php
Hello, congratulations for this great project ! I do have a problem at the first time the page is called, http://thierrybischfree.free.f r/Francais/new_%20flowers.php some images are missing and only appear if I click 1-the image link then 2- go backpage , not after a manual refresh. I also have a top-margin problem . but I am not very familiar with CSS. I would also like to be able to change the height of the gallery, and be able to use it for (very)small thumbs without having them expanded over their original height. I am looking forward to your improvements
Hallo, ich bin der absolute js-noob hätte aber gerne dass wenn man auf das vorderste bild klickt es sich vergrößert...also in originalform wie es auf dem server liegt wäre das machbar? oder kennst du ein tut wo ich sowas finde??
Many thanks for the script! Due to server restrictions I'm not using reflections. But then, the slidebar comes on the pictures and I would like to have it under. Same for captions. How can I adjust these positions? TIA!
@ Mario: ImageFlow scales in relation to the width of the div container. If you change the width you change the height ;D
Hi. Phantastic script. :) But I have a problem. Can I change the height of the whole gallery? If so, which parameter I have to change? I hope you know what I mean. Sorry, english is not my best skill. Thank you and greeting. Mario
@ Gee: Try this: http://tinyurl.com/3rvmff
Hi. I've been using ImageFlow for a while now during development of a new site and it's been working great. But I've just updated to FF3 on the Mac and the scrollbar's drag has become glitchy. Initial scrolling works fine but if you release it then try to drag again it just drags the image. Any ideas? Thanks.
I tried using jpeg's with imageflow but it seems to only work with png files. Also I cannot seem to get this to work in my wordpress blog. is there a workaround for this.
@ Seb: Delete the position:absolute; for the imgs in the screen.css ;D
Is there a parameter to create a vertical imageflow?
@ Gora: Please post a link on your implementation
@ Matija: *oups* I currently work on an encapsulated version of ImageFlow. Check which functions of GoogleMaps are called onload and store them inside the ImageFlow onload. That should work...
Hello! Really nice job... ImageFlow is really cool but while testing it I found a bug. Try to have GoogleMaps and ImageFlow 0.9 in the same html (shown on the same site(. Result is that ImageFlow crushes GoogleMaps (they don't show). Do you have any idea about this?
Noch eine weitere Frage: auf der Highslide-Seite gibt es auch Varianten, bei denen man das geöffnete Bild weiterschalten kann (with gallery). Bin leider daran gescheitert diesen Effekt mir Imageflow zu verbinden. Weißt Du, ob das möglich ist und eventuell schon von jemand anderem gelöst wurde? Besten Dank!
Du kannst mich übrigens auch über: stephan.kohlrausch@googlemail. com erreichen. Besten Dank.
Hey, nice. I am trying to change the bg color of reflection to white. and i have tried both solutions mention in faq, but stil not working.. Help me..
Hallo, vielen Dank und große Anerkennung für Dein großartige Script. Haben das Folgende vor (und scheitern daran momentan): Die über ImageFlow dargestellten Bilder gehören vier unterschiedliche Kategorien an, z.B. so: Kat. A: Bilder 1-7 Kat. B: Bilder 8-14 Kat. C: Bilder 15-19 Kat. D: Bilder 20-25 Wir würden jetzt gerne über einen Klick in einem zusätzlichen Menü (A,B,C,D) die Bilder in Imageflow dorthin gleiten lassen. Also z.B. Klick auf C - IF gleitet zu Bild 15. Habe in den FAQs die glideto Funktion gefunden, sie funktioniert aber lediglich beim Öffnen der Seite, würde gerne die Seite nicht 'verlassen'. Zudem wäre es sehr schön, wenn die Links im Menue anzeigen könnten, wo man sich befinden, während man durch IF scrollt. Wenn ich also von Bild 7 zu Bild 8 springe, verändert sich die Farbe von A und B. Hoffe das ganze ist einigermaßen verständlich und würde mich über eine Rückmeldung sehr freuen. VIELEN DANK !
Brendon Kozlowski, Thanks for the help! Appreciated!
(publ. problems.)img src /a but it start lightbox straight away. I want it to be focussed first on the front of imageflow and then click again to open in in lightbox with the groups. Help someone!
Still working on it to get the imagegroup in lightbox to work. I got the script as: a href .... rel="lightbox[group]>
Sporthockern: http://www.sporthocker.com/
Great scripting! Having loads of fun playing around with it! Keep up the good work!
@Choong Leng: Use ThickBox (it's a jQuery-based Lightbox), there are instructions linked to how to get it working in the FAQ section of this script.
Hi, I love your imageflow. But I need to implement it with jQuery Lightbox. What your recommendation? I can be contacted via cafe99@gmail.com Thanks!
@HELP ME: It doesn't require Perl at all, but it can use PHP (for the image reflection). Although there are image reflection JS options, it doesn't work with this technique. You don't have to use the image reflection though. @Rob: I simply removed anything inside the curly brackets of the onunload function. I saw someone said that simply having an onunload function was good enough. That seemed to fix the issue, though I don't know if it creates a memory leak or not. @Cray: That sounds like a JS page-load function. You could use that and call your ImageFlow from within an iFrame...just a thought though.
Hi! your imageflow is god sent!!. Thanks for this. I have one question. Im going to have hundreds of images loaded with imageflow, but loading will take forever. I'm wondering if anyone have ever figure out to load the images progressively while imageflow interface loads up with somekind of placeholder?
Hi i love your imageflow . Is there an easy way to get the images to open in an inline frame on the same page ? i have looked everywhere but can't figure it out . You would in my opinion be the only person on the whole internet that looks like they may be able to help . Thanks in advance , Jus.
http://www.google.nl/search?hl =en&safe=off&q=imageflow+mooto ols&meta=
Dear Finn, is there a Mootools-compatible version of imageflow somewhere? (could be additional point for the FAQ). Thanks for your cool work.
Sorry on last post. I did not realize that I had not uploaded the hacked imageflow.js file. But, now with the hacked imageflow I can initiate the highslide with a click but the loading indicator just spins. Regards...
Finn... Thanks for this resource. Great Find. I am working with the Wynn version for ASP.NET. I have tried to use the highslide hack with the Wynn version with no success. What more needs to be done besides including the script inside the head tags. I used your highslide paths and files. I do not get the popup of the highslide. Regards... TRU
js error in IE 7 it seems to happen when page loads and refers to this code: /* Fixes the back button issue */ window.onunload = function() { document = null; } specifically the "document = null;" line. anyone come across this or come up with a fix?
Why do you need Perl to run the image flow? why cant it just be javascript and a bunch of images????
An update to my post from August 7th where one can center the image... I happened to have 6 images, so thought it was working, but didn't properly think it through. The following code fixes that: http://pastebin.com/f2803b20f -- that will work as it should, centering the image, or "rounding down" if the total number of pictures is an even number.
Ahhh, that's why you were told to create a container DIV around the ImageFlow DIV. I'm guessing that you already tried it and it didn't work? ...or were you just unsure which properties to set or how to?
@Brendon: Thanks. The height and width of the TD are ofcourse set. The problem is not stretching of the TD. But because of the positioning (relative/absolute etc), the images appear not within the imageflow container. Also the scroller appears wayyyy below. The page has table based layout unfortunately, and changing that to css will mean rewriting lot of pages, so for the time being I need to stick with this layout. There are lot of TDs and somewhere in the middle of the page I need this imageflow container. I can get the images in the container by setting margin-top:500px in the imageflow div, but the problem is it works only in Firefox. IE still shows the "flow of images" somewhere else than the actual container is. :(
@Andy: Set the width and height of your TD. I don't believe ImageFlow will stretch it beyond what it's given. Your image resizing problem - I'm not sure how to describe it to you to help you solve it. :(
Now I understand the container width problem! Thinking out loud here! One suggestion: The imageFlow container should be self-contained. In other words the imageflow container should not depend on the page, or alter the behavior of other elements in the page for example TD, and other DIVs. For many people the code cannot be used as is. (Unless you are a CSS expert) I think if we comeup with a clean version of the code, that does not mess up the overall layout, this will be even more successful. For instance a user should be able to add the div anywhere, even within a TD(that has static width) and it should not distort the overall page layout. I think if we can achieve this through the existing css, this amazing script will just take off! Any tips? suggestions to overcome the container width problem? Thanks a lot
Hey I am quoting you here! When you responded to Sam "..the focussed image will be displayed in the original dimensions, meaning sharp and crisp ;D.." I am taking screen shots of my web properties and in my portfolio page I want to show them using imageflow. Unfortunately imageflow script makes the images distorted and the end result looks crappy. Is there any way to get the image to show in its original dimensions within the imageflow container? I know you talked about container width, but where do i set it? If this would make things easier, I can have all my images have the same width and height. Any help or suggestions greatly appreciated.
@ eva: This is caused by the good image interpolation of Chrome... If you reduce the number of displayed images it should get better. But the 0.2 release version of chrome is a very early release. So hopefully it'll get better with the next ;D
Imageflow is very very slow when using the new Google Chrome browser (XP, 384 MB RAM). No problem with IE7 or FF3.
All done:) Two examples ready which also can be downloaded. Imageflow with youtube and Dailymotion with pagination, slideshow, caching and many other settings. Check them out at http://www.imageflow.nl
OK, no problem. I finally added the scripts in the head so they dont destroy my other stuff. now it works a bit but not how it should. maybe i have a little luck and someone posts a solution for my problem. thank you very much anyway :)best regards, markus
@ Markus: ;D Sorry, I currently have no time for support... . o O ( I really should install a forum for ImageFlow, that everybody can help each other... )
Und wie genau hilft das weiter :) ?
Google Browser: http://www.google.com/chrome
Hi @ all Ich habe leider ien kleines Problem beim Einbau von Imageflow. Ich habe es in ein DIV gepackt auf einer bestehenden Seite, jedoch kann ich die 2 erforderlichen Zeilen nicht im Head einfügen. Denn wenn ich das mache zerschiesst es mir zb mein Menü und alles kommt durcheinander bzw sitzt nicht mehr da wo es sollte. Ich habe leider auch noch keine Seite gefunden welche vom aufbau her der meinen entspricht und imageflow zugleich darauf laufen hat. Gibt es irgendwelche Ideen was man machen könnte um die befehle im head so einzubauen, dass sie meine anderen nicht überlagern? DAnke vielmals, Gruss Markus
Hi, If I add the files, as per the instructions, on to my existing site all my other existing images are thrown all over the page! They are not where they used to be, and the imageflow doesn't work there as well. Does anyone know what could be causing this? And how to fix it?
I'm a little bit closer to the solution with this scriptwork: But then it will open immidiatly if you click on it in imageflow. Hopefully you know how.
Hi! I Found a bug in ImageFlow. When window resize or something else triggers "function refresh(onload)" then conf_slider_width gets lethal on slider position. The variable name should be different on configuration because otherwise the script will divide and divide and divide till it's near to 0. Great script tho. :)
Hi ! Thanks you for your script is very perfect but like Joost, is there a way to make the imageflow with lightbox imageGroups. The Next et Previous Link will be very good for a slideshow ! Thanks for your response
You could also use the joomla imgaflow.js version. They rewritten the js so you could also use the reflection http://www.joomlanook.com/inde x.php?option=com_content&view= article&id=59:imageflow-for-jo omla&catid=36:miscellaneous&It emid=59
disregard my last post. got it to work by removing the reflect.php and giving the full link to the image. no reflection, but no big deal. thanks!
While I'm aware of this limitation ("Is it possible to include many ImageFlows in one site? At this time this is only possible by using iframes. An object-oriented version of ImageFlow may come in the future."), what would you recommend to incoporate multiple imageflows to be used as navigation? For example, 4 images in imageflow on the front page, click "welcome," then having a different imageflow on the welcome page with different links. it's working a-ok on the front page, but no image appear on my subpages. it's an excellent script. thanks for your hard work on it.
hi... How do you add and ajax call when user click on the image in imageflow? I can c there is onlick even whick will call and url... but i want it to get ajax call...
Hi, looking for help to postion the image flow in the center of page and possible help to place it closer to top as well, tried all I know and now I know I know to little!
Your ImageFlow Script is now used on the official Homepage of Star TV, a private Swiss TV Station. www.startv.ch
Perfect script! BUT is there a way to make the imageflow with lightbox script with lightbox imagegroups. So for exsample if there is a picture in imageflow clickable to lightbox and prev and next to a hidden picture. Like to know how! Thanks a lot!
@Finn Not quite that what I want. Check the collection section of http://rockandrepublic.com/ to see an example. Click on an image and you can see it in it's full glory but you stay in the imageflow mode. (you can go back and forth)
Phantastic script. But I have a problem with the placing it next to some text, just as in your main page. IE6 misaligns the elements (ImageFlow is placed downward), whereas it is displayed correctly in FF3 and Safari. How can I correctly place the two elements next to each other? Please look at your page with IE6. Many people still use IE6. Thank you.
Levi released a handy web service using ImageFlow: http://www.bemyhomepage.com/
Great script. I've been playing with it for a while but can't seem to find the setting for adjusting the image sizes. One Image which is a banner type is restricted by the width I think, and I want to increase the width. Also set a max height.
@henk : thank you very much, that's all I needed !
@steph: Look at FAQ #1 http://tinyurl.com/2wph54
Finn hello, your coverflow is simply awesome! I've adapted without too much problem, but I have just one thing I can not do. So I have 5 images in the coverflow and on loading I like that the focus should be on the third image (the central image) how can I do? thank you
Thanks for this great script ! However I've a problem with it : only three pictures are displayed correctly. http://am.website.free.fr/crea tions/index.php?mod=imageflow Is there a solution? Thanks
@ sam: Do you mean by "resized" up or downscaled? In either case I suggest trying the browser opera, for it has a way better rendering engine (image interpolation!) than the IE... If you have a really big screen and you dont want the images to be upscaled I suggest a fixed width of the imageflow container. That is a bit tricky, but if you get the right width the focussed image will be displayed in the original dimensions, meaning sharp and crisp ;D
@ Maurus: You can link on a single image, which then will be displayed in its full glory by your browser. This is what imageflow basically does. But correct me if I missunderstood you...
@finn.Hey there!needed help.Is this possible to not resize the images in the image flow,i have images in width 1024 (website screenshots)and need to do a presentation on a big lcd screen without them being resized.my images are getting really crappy and pixelated.thks in advance
@Finn I want to browse all images in their original size. (after click on the thumbnail version)
Red Digital Cinema... first "enduser" footage @ 120 fps *freak* : http://www.vimeo.com/groups/re dusers/videos/1340684
@ ceaser: neat! ;D
@finn Made an automatic slideshow with imageflow and youtube http://www.imageflow.nl Soon there will be a pro version with picture arrows to retrieve the next and previous movies.
@ Maurus: Implement ImageFlow with a 100% width in an html site and then press the fullscreenmode [F11] of your browser? Or what do you mean by fullscreen? ;D
Hey. Great script! Is there a way to implement a full-screen mode?
Wow, I feel stupid. Thought I had used a relative position command for this container or I would never have posted for help. Thanks again!
Parabéns! Seu trabalho é ótimo!
*Yeeeha*: http://www.greenbird.co.uk/
@ Lee: Why would you like to break the link chain? But okay... try the following: Replace document.location = this.url; in the imageflow.js by window.open(this.url, '_blank') ; For further attributes check: http://www.pageresource.com/js cript/jwinopen.htm
@ Tom: If you can you can ;D
Is there a way to have the image links open a link defined in the longdesc tag in a new window? what do I need to change in the js to achieve this? thanks Lee
Can I use imageflow in a project I created in Visual Basic 6.0? Thanks
@ Shaun: Read the FAQ #13 http://tinyurl.com/2wph54 and try setting your .imageflowcontainer div to position:relative;
Hey Finn: Thanks again for this great script! I am having a similar problem with IE as well. I'm using a container div to hold imageflow, but the images aren't being contained by any of the divs, they simply float at the top of the page. Here's a link: http://willcutt.goodbarry.com/ instruments If you can't help, I completely understand, but any suggestions would be appreciated.
gibt es eine möglichkeit, das glideTo() dynamisch zu gestalten? Also z.,B. aussen am JS-File zu nutzen? Danke & Gruss Roger
Personaly I use why many pictures, but it's for you.
Finn: Thank you for your help. I'm using an IFRAME because I generate the Imageflow from a database. I have tried both your recommendations to no avail. I will try without the iframe. Thank you again.
@ FDX: Do you need to use an iframe? Have you tried setting the iframe position:relative; ? I 'only' encounter a problem with the ImageFlow slider in IE7. Try changing 'img' to '#imageflow img' in the screen.css!
@ Mathieu: Oups... but who uses ImageFlow with only one picture? ;D Thanks for the bugreport!
@ Gus: Can you post a link on your try?
@ Yanis: Thanks ;D
Hello everyone, please help me. I have adapted Imageflow 0.9 to my site (http://www.ehui.com) via an IFRAME and it works great with Opera and Firefox, but in Internet Explorer it shows the images all garbled. (and I'm using a container with position:relative;).
Wenn ImageFlow have only one picture in IE 7 error if (dragging == false) { new_slider_pos = (scrollbar_width * (-(x*100/((max-1)*xstep))) / 100) - new_posx; slider_div.style.marginLeft = (new_slider_pos - conf_slider_width) + 'px'; }
Hello, Please can you help me? I would like to open the bigger image in a new window. onclick="window.open('$url ','Headline','width=817,he ight=480,toolbar=no,directorie s=no,status=no,menubar=no,scro llbars=yes,resizable=yes') I tried this but it is not working. Please help me!!!!
Dear Finn, excellent work. We have implemented a modified version of ImageFlow 0.9 in our upcoming website. Just enter any pano and then click "Fullscreen". We will be happy to contact with you again. A big thanks and congratulations. Kind regards, Yannis www.thessaloniki360.com
I updated my Portfolio: http://tinyurl.com/59wd83
@ Kelly: Wow, I'll try that bugfix and make a new ImageFlow version. Thanks for posting!
hey, is it possible to automatically load an iFrame when an image comes in front for your coverflow implementation?
Finn, found the issue for the highlighting problem in Firefox 3.0. V3 added functionality to let users select multiple blocks of text on the same page by holding down the shift key. This was interfering with your slider_div on mousedown function. Changing line 215 of the js to declare return false solves the issue: slider_div.onmousedown = function () { dragstart(this);return false; };
Hello, I have a problem, when I add the image flow scripts it appears so slow on the page. can somebody help me???? check it out www.naharashabab.com/indexBeta 2.php Thanks!
Hello! ImageFlow is a greate work! It strange, that this project have no domain name and hosting. I ready fo give (without cost) to ImageFlow hosting and (if you need) svn-repository. Please contact me if your are interesting. max.antonoff@gmail.com Or in jabber:// idler_@jabber.ru
Hi, I'm a designer slash novice coder and was looking at your ImageFlow0.9_Lightbox2. I am unable to change the alpha fade to a specific background color. wondering if you could point me in the right direction..
Anyone interested: To automatically set the pointer to the center-most image (or there-abouts) in your set, the following code should help: Replace your window.onload function with the following (it just adds 3 lines): http://pastebin.com/fceb90d3 ... Enjoy. :) One could also add a variable in the script and then place an if/else block in this function based on the variable's setting (set center, or don't set center).
I've got your message and added an extra step to the thickbox & imageflow article. Just an idea for Finn: in screen.css you've got "img {...}" This means that if any other images are on the same webpage they are all messed up. For your next release I recommend changing it to "#images img {...}" :)
I've got your message and added an extra step to the thickbox & imageflow article. Just an idea for Finn: in screen.css you've got "img {...}" This means that if any other images are on the same webpage they are all messed up. For your next release I recommend changing it to "#images img {...}" :)
@Finn: ImageFlow FAQ #12 - Patrick missed a CSS tweak. img, in the thickbox CSS must have position set back to either "static" or "relative" as ImageFlow's CSS setting of absolute will break the bounds of the container DIV for the image once ThickBox is invoked (this may also be similar to the other methods needing a slight change). I'm going to try to contact Patrick to let him know.
@Craig: you're not doing anything wrong. ImageFlow dynamically resizes the images to fit in the #imageflow DIV tag. If you want the images to have a size similar to the original images, you'll have to play around a bit with the width of this DIV (not height, but width). Sprinkle some CSS in there (div id="imageflow" style="width:80%;" ...) and play around with the width percentage until it resembles your original image (or resize your images to better fit ImageFlow's default size). Keep in mind, the width will change depending on the browser unless you use a static width (500px) since my example uses a percentage width.
I'm running into a problem with the thumnails being generated with imageflow. They are pixelated looking. it seems that the resizing is not simply shrinking the image but distorting it somewhat - making it a little taller or wider than the original proportions. What am I doing wrong?
@ceasar I KNOW it's because there is too many images, but the whole point of the site is to let people browse throw ALL gadgets from "The Daily Hiz Wiz" show. The thing I want to do is to load images later. And I basically managed to do this, and it was working fine - the site was loading fast and the images were downloaded as they were needed. The problem was they had totally wrong dimensions (all images had dimensions of the place-holder image), so I had to go back to preloading lower resolution images. I'm looking for a way to do this, but avoiding the problem with dimensions.
@Ludwik First I think there are way too many images. 50 will be enough. Download my youtube version and see how I have done this. I retrieve the images, put them in a cache directory and let reflect.php do the rest
ImageFlow looks great! I made a CoverFlow-like view of all gadgets ever mentioned on the "Daily Giz Wiz" podcast. It's under http://www.gizwizsearch.int.pl /flow/ The problem is it's not really usable. One have to wait for more than 600 images to download before it starts. I changed it to preload low resolution images, start the application, and then replaced them with higher resolution files as they are needed (I put the replacement code into the moveTo() function). It haven't helped much. Loading still takes way too much time to be considered usable. I tried to use place-holder images and replaced them with real files later. It seemed to worked really well - the application started instantly, and the images were loaded as they were needed, replacing the place-holder images (I again put the code for that in the moveTo() function), EXCEPT there was one big problem. The real images were squashed into the dimensions of the place-holder images (looking really weird). Anyone have an idea how to successfully run the ImageFlow script without having to preload all images?
In case anyone wanted to modify the (already modified version of) reflect.php that comes with ImageFlow, as of version 0.9, open up reflect.php and find and add/modify the following (extra code shown to give an idea of where in the file to add this): http://pastebin.com/f507438f This is partially unfinished (but working). You'd probably want to add a few variables to distinguish where your cache directory will be, as well as to delete the local version of the off-site image. (You will want to use unlink($filename) to delete the file BEFORE the exit() statement in the script). Enjoy.
Hallo Finn! Zunächst möchte ich dir zu einer super Implementierung gratulieren. Nun zum meinem Problem: Ich habe eine ziemlich tief verschachtelte Website, die nicht sehr standardkonform ist. Die Positionierung der Galerie funktioniert allerdings werden die Bilder weder verschoben noch die Größe verändert. Hast du vielleicht einen tip welche Fehlerquellen es geben gibt? Gruß Tobi
Hallo Finn, Glückwunsch zu Imageflow, genialer Code. Ich konnte alles perfekt konfigurieren, finde aber im imageflow.js "ums Verrecken" nicht, wo ich den Abstand zwischen den Bildern vergrößern kann – ich brauche das für einige größere Querformat-Bilder. Geht das? Grüße, Jörg
Agile Produktentwicklung im neuen Web: http://tinyurl.com/57nvbd
@ Drew: I thought I made that clear in the documentation: Installation - Step 1 "The reflections of ImageFlow need a server running PHP 4.3.2+ with the GD extension 2.0.1+. Download the latest ImageFlow version, unpack it and upload the files screen.css, imageflow.js, reflect.php, loading.gif and slider.png to your server."
@ ceasar: Sure, why not. This one is for everyone and free to use, manipulate, enhance etc. Thanks for the backlink on the official version ;D
It took me a while to figure out why imageflow was only working on my webserver and not locally on my computer... It's because I don't have php on my computer. So people who don't regularly use php would greatly appreciate if you reminded them somewhere on your website of this!!!
Okay @FINN Finished the whole youtube imageflow version including a download http://www.cfcms.nl/imageflowy outube/ I put a Creative Commons Attribution 3.0 License on this version. Let me kow if you can agree with this new version
Hello. I have a problem with image flow. It works fine in windows, but when i pass it to linux in the same format i can`t see the images. Have you got any idea about the cause of this? thanks a lot
please can xou give me a example for imagflow with longdesc url? thanks
Okay I have fixed the reflection :) http://www.cfcms.nl/imageflowy outube/ Default setting is now keywords legendsoffjazz and order by relevance
i can not download why? :( i am using safari
http://www.cfcms.nl/imageflowy outube/ The GDATA youtube API has been added. I also made as an example an searchbox. Default setting is keywords 'blues guitar' maximum items 25 and order by rating
Finn. I downloaded the Lightbox hacked version. Looks amazing. I almost finish the exercise inserting my photos. I tested and looks superb!. But, how can I insert all these bunch codes into may web page? I mean, I am still on the downloaded html original downloaded page, just I want to know how can I insert my links buttons to keep surfing on my website? I read the 13 questions but I'm lost. I spent much time to finish the html image flow and I do not know how can I insert my links buttons? Help, please. Thanks and Congratulations!
@ Sebastian: Was die Tastatursteuerung angeht, so wäre ein einfacher Fix die Stelle "document.onkeydown" in "window.onkeydown" umzuschreiben. Allerdings dreht sich dann das Rondell auch weiter, wenn die (Wasauchimmer)-Box offen ist.
It's also possible to make it completely out of js with the JSON method but then we miss the reflection though
@Finn I made a youtube mod for imageflow. http://www.cfcms.nl/imageflowy outube/ I also can use the new GDATA api to get the pictures and the url's but for the reflection I need the script for loading external images. @Treviño made that one. I contacted him so I have to wait. If someone else has a mod for retrieving images send it to at info(here the at)cfconsultancy.nl
@ Patrick: I added a link to your site to the FAQ # 12. Thanks for your work! ;D
HTML doesn't work in the shoutbox, so I made my own step by step guide here: http://tyddynadda.co.uk/design /thickbox_imageflow.html I couldn't find tutorial on the internet to say how to use imagflow with thickbox, so I hope this helps :)
Thanks Finn. For some reason, the only way I could get it to work was to add &bgc=ffffff to the URL. For anybody wishing to add Thickbox integration to the script, it's VERY simple! Make sure you have all the thickbox js / css in the head of your html, then change the longdesc of each image to: javascript:tb_show('Caption of image goes here', 'location of image goes here','*') * if you want to be able to scroll through the images within thickbox, set this to something like 'slideshow' for all the images, if you don't then leave it blank. To fix 1 css bug, open thickbox.css, and change the z-index of #TB_window to something like 10200 - not sure if HTML works in this shoutbox...
@ Patrick: I think there is a change in the variable name with version 2.1 - It's not 'bgc' anymore, but something like 'tint'... check the documentation!
@ amex: FAQ #5!!! - http://tinyurl.com/2wph54
The standard "reflect.php" seems noticably faster than the transprent one. Is there a way to "adjust/modify" the background colour of the standard "reflect.php" other than the default Black (#000000)
Thanks Finn, I'm now having another problem... I can't seem to change the background colour of the reflection. I've updated to the reflection.php v2.1 and made sure the colour is ffffff / 255, 255, 255 but the reflection background stays black. What's the best way to change it? Thanks
@ max abann: Why didn't you use Google? Result after 1 sec: http://tinyurl.com/622zc2
@ Patrick: Try to delete the css part that sets the img position:absolute; ;D
hie. can it use imageflow 0.9 with joomla 1.5.3 or 1.5.4. I want use this as material menu because have 100 woods... How to install imageflow 0.9
Danke für ImageFlow! Would it be possible to change the JS / CSS to make ImageFlow scroll vertically (up/down) instead of horizontally (left/right)? Thanks
Webdesign by me: http://www.volkerbreust.de/ ;D
@ Frage: Link to you implementation?
@ Steve: That is not possible since the relation between width and height is set. ImageFlow resizes within that fixed relation.
@ ollo and all: Jepp, with raising questions in this shoutbox and less time I have to answer / doing support for this script a forum is the next thing to come.
@ Lee Tempest: hmmm... the cleanest solution would be AJAX. Allowing the javascript to access a php generated JSON content. I recommend LOKRIS: http://www.ajax-buch.de/lokris /
@ Sebastian: Danke für den Bug-Report. werde ich mir mal ansehen...
@ Lee Tempest: Have you tried the FAQ # 13: http://tinyurl.com/2wph54 ?
@ Jackson: no, but you can programm it by yourself using php...
@Finn or others has someone this sript for loading external images ?? I made to make a mod to retrieve youtube images and clicking will paly the movie Thanks for looking in 21:32 - Treviño Hi... I've made a small patch against ImageFlow to make it load remote images too. This is the patch: http://paste.ubuntu-nl.org/537 76/ ;) Since I've used file_put_contents it needs PHP5, but it could be easily backported using the clasic fopen,fread,fwrite,fclose,[... ] functions to make it work with php4 too.. Using this script, with a simple phpFlickr-based tool, I've made a cool flickr Imageflow. Here's a demo: http://gallery.3v1n0.net/image flow.php
Habe das script und das ganze per include eingebunden steht im body bereich funtzt aber nur wenn ich jetz per ajax auf eine unterseite geh und dann wieder auf dieses imageflow kommt dieser error und die funkltion bricht ab: img_div is null refresh(undefined)
Let me try asking the question this way ... How do I resize the parent Imageflow display to 960 pixels wide by 200 pixels high, with the slider bar and the thumbnails inside that box?
make a div with this image in your page which is display:none (unvisible)
Hi, is there anyway i can't extent the timer ? windows only displays the loading bar for a split second and disappears, but the images continue to load after that. Anyway to work around this ?
hi! reference to my post of the 17 juil. i found the solution: my "reflected" images where too big, so that was making FF3 laging graphics moves - so it's resolved... a wish: it'll be very great to make a real forum for imageflow! thanks, 0ll0.
Well I solved my earlier issue and now have a working module running within Joomla. Check out http://www.beta.litchfieldmorr is.co.uk. To things I would like to accomplish is having the user define which image the flow starts on. How can I configure the Javascript file to read a variable from the backend of Joomla? Thnaks, Lee
Nach viel rumprobieren habe ich die Gallery endlich zum Laufen bekommen. ich habe nur noch ein kleines Problem. Wenn die Gallery erstmalig geladen ist kann man wunderschön mit den Pfeiltasten hin und her navigieren. So bald ich aber ein Bild öffne (ImageFlow mit Lightbox2) mir das Bild mit Lightbox2 anzeigen lasse, das wieder schliesse, ab da ist dann keine Navigation mehr per Pfeiltasten oder Mausklick möglich, nur noch durch ziehen des Schiebereglers. Der Fehler tritt genauso auch bei der Demo version hier auf der Page auf, ist also wohl ein genereller Bug, gibt es irgendwelche Möglichkeiten diesen zu beheben? Denn dann wäre es wirklich perfekt!!! Vielen Dank schon mal! Lösung notfalls bitte auch per Mail an s.schoeningh (ääd) gmx.de Grüße Sebastian
Is there a way to display all the images in an entire directory without having to type in the all the html code for each photo?
I am having a difficult time altering things display every image within an entire directory using PHP. Is there some problem with doing this I am unaware of? Thanks.
Dear Sir, I'm hoping you can help, I'm trying to create a Joomla module based on your ImageFlow javascript. I'm having issue and hope you can help. Please view www.beta.litchfieldmorris.co.u k to see how far I have got. I cannot get the cover flow to display properly. Can you help or offer some advice? Thanks Lee Tempest
Partly answering my question from 18 July. To shrink the height of the display, in css, I can comment out the min-height and add max-height: #imageflow { width: 570px; max-width: 800px; /*min-height:20%;*/ text-align: left; margin: 0 auto; position: relative; border: 6px double gray; background-color: black; padding: 0px 20px; max-height:200px; } Now I can change the width of the display to anything I want and the display box is locked at 200px high. But the thumbnails float outside the black-or-yellow-bordered display box. So ... what do I change to shift the thumbnails and the slider into the resized box? In advance, thanks.
Could you please tell me exactly where I change the code to allow my images to be a larger size? I read the instructions but I still don't understand where to go to make this change. Could you please answer back in English. I don't understand the language on this site. Thank you, Sarah
TRACTOR: http://www.vimeo.com/1351285
I resolved my problem. Remplace the piece of the imageflow.js script to take on boad displaying of one picture whithout error on IE7 : if (dragging == false){ new_slider_pos = (scrollbar_width * (-(x*100/((max-1)*xstep))) / 100) - new_posx; slider_div.style.marginLeft = (new_slider_pos - conf_slider_width) + 'px'; } BY : if (dragging == false) { new_slider_pos = (scrollbar_width * (-(x*100/((max-1)*xstep))) / 100) - new_posx; if(array_images.length==1) new_slider_pos=0; slider_div.style.marginLeft = (new_slider_pos - conf_slider_width) + 'px'; }
Hello Timo. 1) Download ImageFlow 0.9 on "http://194.95.111.244/~count zero/scripts/_myImageFlow/" 2) Modify "index.html" to display only one picture 3) Open IE7 and test index.html. 4) IE7 show an error warning (on bottom left of window). You could double click to have more details.
@Mouss: Worst question ever! How about telling us EXACTLY what your problem is?
Hello all, I have a problem when i use only one picture with IE 7. How could i resolve my problem ? Thanks.
@SioS: Nochmal: Für mich sieht alles ganz normal aus. Das Imageflow ist im Hauptfenster weder zu weit rechts noch zu weit links, sondern füllt den gesamten Hauptframe aus. Soll es etwa nur die linke Seite des Hauptframes ausfüllen? Wenn Du ernsthaft weitere Hilfe erwartest, dann erstelle bitte zwei Bilder: Eines davon wie es im Moment bei Dir aussieht (mit Markierung, was daran falsch ist). Und dann eines davon (z.B. mittels Photoeditor Deiner Wahl) wie es aussehen soll, evtl. auch hier mit deutlicher Markierung der Veränderung. Ich sehe nämlich auf Deiner Seite kein Problem mit dem Imageflow. Ach ja: Da eh nur maximal neun Bilder sichtbar sind, macht es keinen Sinn, jedesmal 50 Bilder für eine Testseite zu laden...
Oh sry... Ja es ist Rechtsbündig, wie unten auch genannt... Aber es soll ja eigentlich linksbündig sein... Sorry, mein Fehler!
15:40 - Steve Leon, sl@leonhouse.org
I am working to include ImageFlow from JoomlaNook, built upon ImageFlow, in a web site I am building. I will need a license for this commercial site. That's not the question of the day, however. How do I set ImageFlow to display as a wide but short module in Joomla 1.5.x? For example, 960px wide by 200 or 300 pixels tall? Danke!
@SioS: Jetzt stellt sich mir die Frage, was Du unter "rechtsbündig" verstehst. Für mich sieht sowohl unter Opera als auch im IE alles ganz normal aus. Willst Du etwa mit einem anderen Bild als dem ersten starten? Dann lies den ersten Punkt der Imageflow FAQ. Ansonsten mach einmal einen Screenshot und markiere was falsch ist und wie es Deiner Meinung nach sein sollte. Solange die Seite noch im Aufbau ist, rate ich Dir, von einem Framebasierten Aufbau zu einem CSS-basierten Aufbau zu wechseln. Es sei denn Du hast Gute Gründe, die für Frames sprechen... Ein "perfektes" freies CSS-Layout gibt es zum Beispiel hier: http://matthewjamestaylor.com/ blog/perfect-3-column.htm
body { background-color:#000; text-align:center; color:#fff; margin:0; padding:0; font-size:100.1%; font:83%/1.4 verdana, arial, helvetica, sans-serif; } img { position:absolute; top:0px; border:none; } h1 { text-align:center; } a{ color:#fff; } .clear{ clear:both; } #images{ visibility:hidden; } #loading{ margin-top:50px; text-align:center; width:100%; } #loading img{ margin-top:10px; position:relative; } #captions{ font-weight:bold; position:relative; text-align:center; z-index:10000; } #scrollbar{ visibility:hidden; position:relative; border-bottom:1px solid #b3b3b3; z-index:10001; } #slider{ position:absolute; margin-top:-7px; margin-left:-7px; z-index:10002; background-image:url(slider.p ng); background-repeat:no-repeat; width:14px; height:14px; } #imageflow{ margin-left:350px; text-align:left; } #changelog{ width:349px; border-right:solid 1px #666; float:left; margin-top: 15px; } #changelog div{ text-align: justify; padding: 0 15px 5px 15px; } das is die css und meine seite ist http://sios1.si.funpic.de, nciht wundern die seite steht gerade erst... und wollte als erstes erstmal imageflow fertig haben^^
nur ein wenig... aber der Kerl der hintermir sitzt und mir bischen unter die arme greift schon wesendlich mehr... Aber er weiß auch nicht warum das alles nicht geht.. und ja } #imageflow{ margin-left:350px; text-align:left; } das steht in der css... aber selbst wenn cih die pixel änder, ändert sich nicht...
@SioS: Noch ein Grund mehr, endlich zu Deiner CSS-Datei oder Deiner kompletten Imageflow-Einbindung zu verlinken. Verfügst Du wenigstens über html-Grundkenntnisse?
Ähm.. Sry Timo, für mich ist das nciht klar...
Would it be possible to change the slider so that the left and right edges of the slider don't travel further than the edges of scroll bar, rather than being based on the mid-point of the slider as the minute.
Hi Finn, i am trying to use this script along side a step carousel, but it seems to clash with the jquery the carousel uses. any idea how i can solve or work around this problem ?
hi there! i have the same "graphic problem" as Shaun Cowley (11jul) with firefox3.0.1, you can see it on this gallery: http://0ll0.free.fr/pao_cds.ph p - but, if this could help, always with FF3.0.1 another gallery seem to be "normal" with graphical fluidity see it there: http://0ll0.free.fr/pao_aff.ph p - So i'm asking me about the square ratio is perhaps a kind of reason of this graphical lag? thanks again for your work.
@SioS: Ein Link zummindst Zu Deiner CSS-Datei wäre sinnvoll. Wenn dort z.B. "#imageflow{ margin-left:350px;}" steht, ist alles klar...
Ach ja, vergessen zu erwähnen: Bei mir liegt das nicht am IE, sondern es ist allgemein so.
Hi Finn, ich habe folgendes Problem: ImageFlow ist bei mir immer Rechtsbündig... Ich kann es nicht Zentrieren oder Rechtsbündig machen. Woran kann das liegen?
@ Christian: Hmmm... Keine Ahnung. Liegt vermutlich an dem centered Layout deiner Seite. Versuch mal ImageFLow in eines dieser Layouts einzubetten und wenns funktioniert übernimm das: http://matthewjamestaylor.com/ blog/perfect-3-column.htm
@Finn: Danke für die Antwort, funktioniert aber leider auch nicht mit dem div position:relative; Hast du noch eine Idee woran das liegen könnte?
@ Finn: Thanks a lot for answering!
@ Wolfgang Schaller: That is ugly... but to be honest: I'll rather take some time to fix that Firefox 3 bug than doing a bug fix for an old(!) browser, nobody likes ;D It is a "proof of concept" implementation only... not a finished product...
@ Shaun Cowley: I am aware of the selection bug in Firefox 3 and will have a look into that. o O (If I jsut find some time for such things) All hints on possible bug fixes are appreciated!
@ all people having positioning problems with ImageFlow in the *'§$%$ IE: I've added a new FAQ entry (FAQ #13): http://tinyurl.com/364o5r
@ James: You could use the Lightbox2 implementation of ImageFlow: http://tinyurl.com/2jpbjn positioning of the slider is set via JavaScript in the imageflow.js...
@ Su: Have you tried to encapsulate the imageflow div with another div that has the CSS attribute position:relative; ?
@ Michi: ImageFlow lädt alle Bilder vor und zeigt sie danach erst an. Wenn du viele Bilder verwendest würde ich kleine Thumbnails empfehlen, die auf größere Bilder verlinken, oder AJAX zu implementieren... also on demand Bilder nachladen...
@ all: Sorry for the late responses. But I had an important exam to pass... diplom in progress ;D
Ha... added a onload-function to the IMG-tag and this seems to work. is this ok, or are there any other ways to achieve this? THX, Daniel
Hi Finn, may be you can help me once more.... So far everything works, but images are only displayed after changing my gallery twice. Looks like the refresh-function is either not started or started to early at first load. See at http://www.draes.net/gallery. Click Venezuela, than Hochzeit, than again venezuela. Thanks! Daniel
First of all thanks for that great photo gallery! Now I may seem a little bit too fussy, but what about the "not so good looking" effect, when you open one picture after another with the lightbox 2 effect? The picture you opened before is shown first, instead of a white fill, like it is in the original lightbox 2. Is this a bug of my browser (IE6) or is it a known problem, which is still to be fixed? Or is it no problem at all? Thanks for any comment.
Hi there, I just want to say thank you for a wonderful product, you can see my working gallery at http://shacow.com/gallery.html I have just one question, do you have a fix for fire fox 3? Because when scrolling the images there is tremendous amounts of graphical lag. But There is none with other browsers. thank you, info[at]shacow.com
Kann mir jemand sagen, warum das im IE nicht funktioniert: http://christian.fotoblogs.ch/ konzept/ Can anybody tell me why this doesn't work with IE: http://christian.fotoblogs.ch/ konzept/
hello Su! in "imageflow.css", add "position: relative;" in "#images" style. It should work now.
Hi, Thanks for the great work! Just want to know, what is the significance of image.pc = 118 for landscape and image.pc = 100 for portrait and square? Thanks
I'm trying to integrate imageflow with slimbox but I can't seem to get the popup to stay. Any ideas. Also any ideas about why the slider travels out of the left and right scrollbar edges http://www.staumc.co.uk/flow/
Gostei muito de sua galeriavaleu parabéns
Hmm.... may be I was to quick. It works perfect with firefox, but safari does not resize the images. ARRGH. Any ideas why?
Ha!!! Finally i found it!! When I called the refresh from the outside JS-file (minishowcase) I was passing in a false -> not onload. Therefor no resize happened. Now it works perfect!!! Thanks for this great script. I will certainly put a note somehwere to link to your place!
hello! i have solved my problems with the link on the logo and the links on the pictures. but what about the functionality in IE7 or 6? henk also mentioned that problem. has anybody an answer to that problem. the tool works without any problems in safari and firfox. http://zetb.de/upload/test13 http://zetb.de/upload/screen.c ss
@ su: Your website isn't displaying properly in IE6. At the right side the pictures are too large. I have a problem like yours, but I don't know the solution yet... Maybe you also don't have the problem in FireFox and other browsers?!?!
Hallo, Wie verhält sich den das Script mit richtig vielen Bildern. So 200+ ? Werden alle Bilder erst geladen? Danke, Michi http://www.tinywebgallery.com
hallo finn! erstmal danke für das klasse tool! jetzt habe ich das auf meiner seite eingebaut - habe aber leider probleme das logo zu verlinken, das in einem extra div sitzt. Außerdem gibt es wohl noch einen link auf den bildern, der ins nichts verlinkt. nur wo ist der bloß? ich finde ihn nicht. findest du vielleicht meinen fehler? http://www.zetb.de/upload/test 4
Perfect CSS Layout: http://matthewjamestaylor.com/ blog/perfect-3-column.htm
@ Daniel: Versuch mal das ImageFlow div nochmal zu kapseln mit einem div, das die CSS Eigenschaften position:relative; hat.
is there anyway i can replace the light box with a photo gallery ? instead of just one photo ?
Pfff. looks like I got it working. I added my own resampling at the end of reflect.php.... don't know though if this is the way it should be.....
Hi Finn, bin grad dabei Dein ImageFlow/Lightbox Script noch mit der minishowcase-Funktionalität von mehrere Alben zu verbinden. Soweit tut alles, nur resizen die Bilder nicht mehr zum dem DIV-Container wie sie sollten.... Woran könnte das liegen? Link zur Demo: http://www.draes.net/gallery
Hey Finn: I work a lot of real estate sites and recently thought ImageFlow might be a cool way to present real estate photos and info... So, I put together a little prototype at http://www.homeroller.com . It's driven by a Apache/MySQL/Java/JSP/JSTL backend with a simple keyword search interface; data provided by a couple Florida MLS feeds. If anyone likes the idea and would like to work on this some more with me, shoot me an email marrotte@gmail.com.
Habe dir eine Email geschickt. Habe etwas dran gearbeitet. Das script scheint einige Probleme mit "shadowbox" zu haben, jetzt werde ich wohl auf Lightbox umsteigen müssen. Schade - aber für Schönheit muss die Page wohl leiden :) Komisch sieht es weiterhin aus...
@ Nobo: Dann hast du wahrscheinlich nicht den Pfad im Header auf die neue position der verschobenen imageflow.js angepasst... und ohne JS nix Effekt... Aber ein Link auf deine Implementierung wäre hilfreich.
@ Marc: Link auf deine Implementierung?
@ Milanov: What exactly is your problem?
Hi Finn, erstmal vielen Dank, dass dein Script überaupt öffentlich ist! Leider möchte das Script leider nicht so wie es soll (okay, ich bin soweit, dass ich an meiner Intelligenz zweifel!) Ich versuche dein Script in meine Page einzubinden und habe dafür die reflect.php in einen anderen Ordner verlegt (sowie eine andere Image-struktur und die JS in einen anderen ordner gepackt). Nun zeigt das Script ein "loading" an - und mehr nicht. Ich habe schon alles versucht, die pfade natürlich angepasst, auch für den reflect.php aufruf - nur verändert sich nichts. Ist dort noch irgend etwas anderes zu beachten? Habe die imageflow divs in eine verschachtelte div gelegt. Sind irgendwelche Bugs bekannt? Gruß aus der der Nähe von Rendsburg, Nobo
Hi Finn, I am really not able to set the script to display the image in the center in it's original site. I tried playing woth the imageflow dv but to no avail. Any guidance? http://tinyurl.com/5wr3p6
Ich habe noch eine Frage.: Ich habe die Imageflow-Galerie in einen Frame reingesezt. Dieser Frame ist 400Pixel hoch. Die grossen Bilder sind aber nur ein bischen grösser als die Galeriefotos. Was und wo muss ich verändern, um die grossen bilder noch grösser zumachen. Ich habe die Imageflow-Galerie mit Jalbum gebaut, habe auch dort die grösse verändert, funktioniert aber nicht. danke Marc
@jasmina Vielen Dank für deine Hilfe. Ich habe den Fehler entdeckt. Ich sah den Wald vor Bäumen nicht. Grus Marc
@ finn: hey danke für die schnelle antwort :-) nur leider bin ich in javascript ne absolute null, wie krieg man dann die ausgelesenen daten in die image attribute ? @ marc: als erstes mal deine pfade checken ( bilder und js ), ebenso gibt es probleme wenn du MM_preload für irgenwelche buttons oder so verwendest
Holla ich bin es nochmal. eine Frage habe ich noch: Wo finde ich den link zu embedmovie.js der im res-Ordner ist. Dank Marc
Einen schönen Abend wünsche ich Euch allen. Ich versuche gerade auf eigene Faust meine Internet-Seite zu bauen und möchte Imageflow gerne mehrfach einsetzen. Ich weiss, ich habe auch die FAQ gelesen. Ich wollte auch nur mal nach fragen ob Ihr schon weiter gekommen seit. ich bin sehr interessiert. Ich selber habe es nicht hinbekommen.(bin aber auch kein Programmierer). Immerhin erscheint der Ladebalken, aber die Fotos erscheinen nicht. Ich würde mich über eine Antwort oder Tip freuen. Grüsse Marc
@ jasmina: Du kannst mit JavaScript via AJAX Daten in XML Form importieren. Ich habe gute Erfahrungen mit den Lokris-Bibliothek gemacht: http://www.ajax-buch.de/lokris /
hi, super sache dieses script, vielen dank dafür :-x ich habe auch eine frage. ich habe gerade imageflow in verbindung mit lightbox auf meine seite integriert. das hat auch prima geklappt: ))) jetzt würde ich gerne versuchen die bilder dynamisch aus einer xml einzulesen, hab jedoch keinen plan wie ich sowas mit java anfangen soll. gibt es da evetuell auch ein beispielscript ?
hallo finn. gibt es eine möglichkeit, das glideTo ausserhalb der imageflow.js zu nutzen? wäre natürlich sehr nützlich wenn das irgendwie möglich wäre ;) Gruss Roger
Is there a way to "live load" the images?
@Tyler: I do!
Hey I was wondering if anyone knows how to set the slider to be half way on the scroller div and the middle img is shown.
Gruß aus Owschlag. Imageflow ist ein super Script - hoffe ich kann es in meine seite integrieren... bis jetzt zickt es etwas :D Ich wünsche eine schöne Kieler Woche :)
I guess I can't put the HTML in here, but if anyone wants to see it they can got to http://cinemasaville.com, and check the code. There's also some pretty funny stuff there. Thanks again.
Finn, never mind. I got the database restored. Here's what it looked like...div class="left_arrow" onclick="handle(1)">
@ Jeremy: Within the imageflow div?
Danke für den Input, Finn. Leider hat es nicht geklappt. Habe nun den Images eine Classe zugewiesen und dieser position:absolute; zugeteilt: Funktioniert!
Finn,I know it's simple, but where in the html does that go. I know it's idiotic, but I need to know where to insert that code. Thanks.
@ Jeremy: Oups... I can't find it anymore either. But that was simple. Object onclick handle(+1) or handle(-1) Thats all!
@ Chris: If you use mod_rewrite you need to make an exception for the whole images folder in yout .htaccess!
@ roger: Konflikt mit einem anderen CSS, dass die IMGs nichtmehr absolute setzt... include das für imageflow als letztes!
@ Finn-Fan: Read the FAQ!
@ jerk: Phatten respect! ;D What makes you think I don't care? To make one thing clear: I did ImageFlow and the support for it in my freetime and have currently (for private reasons) not that much left to answer questions that one can answer for himself by using google or reading the FAQ. I'm just a human too ;D
Finn, can you repost that example with the handles. I lost my database to my site, so I have to rebuild with that example you gave, but it's gone now. Thanks
Will you show some respect to those added questions?!!!!!!!
I figured it out. The CSS included with the download has some CSS specific to your site.
I'm trying to use your script in a project and when I added the JavaScript, which is as far as I got in the implementation, I loaded the page and every image on the page was taken off the page and placed at the very top of the page. Any idea why this is happening?
I know have an example ready with sound effects and highslide http://www.cfcms.nl/voorbeelde n-van-cfcms-systemen.html There are two sound effects. One on select image and one on the onclick highslide
Hello, Great script mate! Just one problem, i'm using mod_rewrite and the images are not displayed. Is there something i should change in reflect.php? Alla the images on my site are like ..src="/images/name.jpg"... Thanks!
hallo finn nutze das imageflow schon länger auf verschiedenen seiten. auf einer neuen habe ich jedoch das interessante Problem das die Bilder untereinander angezeigt werden (siehe http://img10.myimg.de/Bild174d aa.png). Code ist original, ohne änderungen. Hat jemand eine Idee wie man das beheben kann? Gruss Roger
Hallo! Das ist ja mal ein klasse Tool. Vielen Dank! Aber wie genau funktioniert das nochmal mit dem Text, den man unter den Bildtitel einfügen kann? Kann ich auch eine zweispaltige Tabelle mit Text einbauen? Was genau muss ich in HTML-Entities umwandeln und wie funktioniert das? Vielen Dank schon einmal für eine Antwort ;)
hallo finn, wahnsinn das imageflow. hab nur nen paar fragen. kann man die bildgröße des hauptbildes ändern? wenn ja wo und bei mir hängt das imageflow einfach zu weit links auf der seite. wo kann ich die position ändern? bitte hilf mir. vielen dank
هاى علاء
@Ice I made an example with book flip sound on onclick and dragging the slider. I will sent this version to Finn so he can sent it to you guys
Hi Finn, sehr cooles imageflow, habe noch vor ein automaisches weiterschieben der Bilder nach ein paar Sekunden hinzuzufügen und vielleicht so einen "shuffel"-sound wie beim Kartenmischen. Gruß Ice
@ heinetz: Lies dir die Fehlermeldung nochmal genau durch: "[...] You are missing the GD extension for PHP, sorry but I cannot continue. [...]" = auf dem Server fehlt die GD Library!
Hello Finn, thanks for your reply. I will play with it and see how it works out!
hi, ich habe imageflow auf meiner Entwicklungsumgebung erfolgreich zum Laufen gebracht. Bei der Installation auf einem anderen Server tritt ein Problem mit der reflect.php auf. Das ieht so aus: Warning: dl() [function.dl]: Unable to load dynamic library '/usr/lib/php5/20060613/gd.so ' - /usr/lib/php5/20060613/gd.so: cannot open shared object file: No such file or directory in /var/www/gastrovision/htdocs/_ content/includes/functions/ima geflow_reflect.php on line 43 You are missing the GD extension for PHP, sorry but I cannot continue. Ist das nun eine Fehlkonfiguration des Servers oder muss die Anpassung in der reflect.php gemacht werden? danke für Tipps und beste gruesse, heinetz
@ Milanov: The images are scaled in the original proportions, what makes the difference is the interpolation engine of the Browser (Opera=best, IE=worst). You can achieve the original size (and thereby best rendered quality) for the centered image by setting the imageflow div to a static width. I don't have a formula for you, but you can achieve it by iterating a bit ;D
Hi Finn, first of all thanks for writing this awesome script. It is the foundation of my website design and I really love it. Appreciate your effort. I have one question though, I have noticed that it somehow resizes the images and they look a bit distorted. Can the script keep the original images size?
Wollte nur mal die Implementierung von Imageflow als Plugin in der Coppermine Photo Gallery unter Benutzung von EnlargeIt! vorstellen. http://tinyurl.com/3tpyyh Ich finde, es macht sich sehr gut. :) Link zu den CPG plugins: http://tinyurl.com/3w2kjw Gruß, Timo
Thanks Finn
@ Carl: I'll have a look at it...
Hi there -Firefox 3 messes this script up a little bit, when moving the slider along it begins to highlight the images. Any idea how to fix this?
Is it possible with this script to generate diffentend folder. I´ve got about 1000 Potos and would like to arange them in folders. How would this be possible that the script shows up my diffenent folders with defined picture in it?
Hi ...can anybody please help me i love the imageflow plugin for wordpress but i can not get it to funtion...I installed everything but seeing that I do not know worpress I can not understand your last step of......Go to your post and enter tag [imageflow=GALLERY-ID] ....how do you do that...If i put the code in the post it only prints it on the screen....worpress do not see it as code.....how do you enter that....please help Jean info@royalpelican.co.za
Dear Finn, excellent work. We have implemented a modified version of ImageFlow 0.9 in our upcoming website. Just enter any pano and then click "Fullscreen". We will be happy to contact with you again. A big thanks and congratulations. Kind regards, Yannis www.littleplanet.gr
@ nuno: There is NO way to protect ANYTHING that is online and rendered in a browser from beeing copied. A good example for getting content from swf containers is http://www.ave-imperator.com/ Don't be naive... the internet is not based on protecting content, but on sharing (read: copying) it!
hello its possible protect the images in lightflow once is not in flash but html? mail: indouro@yahoo.com.br www.nunomoreira.eu thkx
Hello, I have a question, when you scroll through the Gallery, whent he image is on front, if you click it, it opens the image in full size. How can I control what's being opened?
Super geil gemacht. Weiter so!
I like that Domino USB Sticks: http://tinyurl.com/3p8nkt
http://www.vimeo.com/1188626 "Buddha in a box" - Work in progress...
you da shizza
That is SO cool :D
@ JacK Barron: Neat! But breaks in Opera 9.5... FF works flawless
Hi there, Thank you for this wonderful Gallery! I have a similar question as 'Stef'. When image is on focus, in the middle, if it is clicked it opens the full image. How can I control what's being opened or make the images non-clickable once they are in the center? Also, how can I control the sizing of the images - they seem slightly distorted sometimes. Thank you thank you thank you!
Hello, just wanted to point that I'm using a pimped version of this wonderful script, here http://www.electronfestival.ch / look to the photos sections Works fine with 190 pictures !
Helo, thanks for a wonderful script! I have a question, how can a change the link when the image is clicked? Thanks!
Can we communicate other than through this awkward system Web pate? Earlier, I left my e-mail address.
@ Alistair Fraser: http://www.kopimi.se/kopimi/ ... And if you like a donation is highly appreciated ;D
Superb---and the addition of the opacity is really lovely. May I use the code? I want it to implement a small online Web gallery for a small non-profit museum in the mountains of Western Canada.
@ alistair@fraser.ccw: http://tinyurl.com/4we3jc
Is it possible to make imageflow cyclic? Alistair Fraser
xajax is an open source PHP class library that allows you to easily create powerful, web-based, Ajax applications using HTML, CSS, JavaScript, and PHP. Applications developed with xajax can asynchronously call server-side PHP functions and update content without reloading the page.
@ Timo: Word! ;D
OT: With this release Opera wants to break the 1%-barrier. Those who use opera love it. But IE is preinstalled (therefore used by most people) and FF has a market share around 30%. Good luck Opera, your browser is worth more than 1%! If you want to see your webside how it's supposed to look like: use Opera! But keep in mind the IE renderer will mess it up badly if you keep to near to the standards ;-)
*hoooray* Opera 9.5 has been released: http://www.opera.com/
Danke Finn!!! Ich zeige später mal meine fertige Lösung.
@ Florian: my fault. Use "#imageflow img" instead of "img"...
Habe imageflow auf meiner website am laufen und benötige sie nun local unter osx. apache rennt local php auch aber die bilder werden nicht angezeigt. bin newbie was den teil in os x leopard angeht kann mir da einer helfen?
I am again. I have now found the error, but I do not know how I can fix it. In style.css img is defined and so he makes my template broken. If I delete IMG. Or img in img.flow convert, then the images are not side by side. The images are then superimposed. What can I do? Thank you ever.
@Finn - thanks that easy enuf :)
Im totally bugged down here.. i cant figure out whats wrong.. theres nothign wrong with the images, however i can maybe see a problem with the code.. it looks for Glideto(-300,3) because its number 3 image and the formular then says (-(2*150), 2). heres the code: window.onload = glideTo( -300, 2); but that returns utter failoure :(
Heres the website: http://webshop.alphaline.dk/
Does that mean when you use glideto function and you pherhaps miss my a pixel or sumthing liek that you will get the max not defined error? because the script works flawlessly until i start using glideto a specific position in the code :(
@ Trial: use PHP...
Is there a way to use the code to just pick up the all the images from a folder instead of adding each image in the div?
Hello ... Thank you for fast Anwtort. I have now found a tool, which was made Typo3, but then my template broken. http://typo3.org/extensions/re pository/view/msimageflow/0.1. 1/
@ Christoph: Yes there is a way. I recently made an UNOFFICIAL and NOT SUPPORTED version of ImageFlow for a client. It features opacity and an endless loop: http://tinyurl.com/3fdwg5 Enjoy!
@ Harald86: Plain and simple? Use smaller images ;D Optimize the size and quality for the web and 30 images should not be the problem. If you go > 100 images you should consider using the HighSlide version with smaller thumblike images that flow and the big images on highslide... I used the benchmark only for understanding the image interpolation handling of different browsers. The loading speed is only limited by your bandwidth!
@ Florian: Was findest du denn an dem Inhalt uninteressant ;D ImageFlow can be resized by resizing the div container #imageflow. You just need to set a certain width in the css and the rest will scale itself in relation to that...
Hallo nochmal... Habe eine Seite gefunden (der Inhalt ist uninteressant)es geht mir nur um die Art, die ImageFlow eingebunden wurde... http://www.evasyadan.com/evas. php?mod=01 wie kann ich das umsetzten? Vielen Dank schon mal... Gruß Florian
Hello there...great tool and just one question remaining! Is there a way jump back to the first image as soon as you arrive at the last image, i.e. jump from the right-most image to the left-most image? Thanks a million!
Hallo... Erst mal Danke und Respekt an dein Tool ImageFlow 0.9. Sehr schön gemacht, jedoch folgendes Problem. Ich möchte das gerne im CMS Typo3 benutzen und habe dafür nur ein Feld von 400 x 450 px... Jedoch ist dein Tool größer... Wo kann man die Größe ändern, damit nicht das template kaputt geht...??? Danke schon mal...
TinyTim I had the max not defined error when I didn't have one of the images that it was looking for uploaded to the server.
sorry, I just saw the last post. English is asked for ;-). First of all: Thanks for this nice work! I have the problem, that I have to use ap. 30 different pictures in the gallery. The loading process lasts very long. In your performance test (100 pics) you used moreless the same pics. What can I do to get the loading faster? Which pics should I preload? Regards Harald
Hi, habe deinen Performance Test mit 100 Bildern angeschaut... Da sind ja viele gleiche Bilder. Stehe vor dem Problem ca. 30 unterschiedliche Bilder nehmen zu müssen...da dauert schon das laden der Bilder sehr lange...hast du Vorschläge/Lösungsansätze? Welche Bilder könnte ich vorladen? Die Reflections? Danke Harald
Hi. Im attempting to use the GlideTo function however the page returns the error: "max not defined" ??
Annieone- can you tell me in english?
got it, my fault.. :o/
ooops, miss t. going to borrow all the design on the fly..?? well.. anyway: ich hab mal ein bisschen php gebastelt und stelle fest, dass es geht - nur beim scrollen via scrollbar ändert sich (via js?) je nach bild-position auch die position der weissen linie - und ich kapier nicht warum.. any ideas for me? meine baustelle: http://annieone.de/scripts/ima geflow/
Here is the link to what I am doing. http://www.cbkgroup.com/Capito l_Lighting.html
I used your script and my images are not ready properly in IE6. they look beautiful on my mac. How do I make the images wider and I am not a css person so exact directions would be helpful. thanks and love it.
wow, vielen dank für den link! happy weekend..
Inspiration: http://www.vimeo.com/1109226
PS, you can contact me here...matt.jcas@gmail.com. Thanks
Hey, Great job with Image Flow, it look fantastic! I was hoping to use it in a section of my site (which is currently in development)... would that be OK? The .rar file download doesn't seem to work...
@Finn: ich konnte die Werte nun erstmal durch statische ersetzen, weil das Layout das zuliess. Das ist zwar nicht besonders elegant und behebt den Fehler nicht, aber aus zeitlichen Gründen geht es gerade nicht anders. Danke für das Angebot, Dir den Link auf die Implementierung zu schicken. Ich komme ggf. darauf zurück, wenn's die zeit zulässt.
Hi, Please tell me from where i get the Documentaion . I downloaded the .rar file bhut there is not ant document.
@ annieone: Es gibt eine ImageFlow Implementierung für die Jalbum Bildergalerie: http://jalbum.net/skins/skin/L ightFlow
@ heinetz: ? poste mal bitte ein link auf deine Implementierung...
Hilfe ! Bei meiner Implementierung von Imageflow wir macht der IE einen ganz groben Fehler: Die Berechnung von: images_top = imageflow_div.offsetTop ... ergibt in verschactelten DIVs 0. Mit images_left verhält es sich genauso. Die Eigenschaft offsetTop scheint im IE den Abstand zu Elternelement zu ergeben. Ist das bekannt ? bzw. gibt's dafür Lösungen ?
oh, dann werde ich wohl mal nach einem entsprechenden script forschen müssen ;o) bin ja leider nicht die grosse phplerin - aber danke für dein super script übrigens!
@ annieone: Jepp, du muss einfach via php die img tags generieren.
@ cabi: Sorry, but I only support the ImageFlow JavaScript as it is and not it's implementations ;D
Hi, I put this skin in the JAlbum and make the album but finally, in the album (in firefox) I don't see thumbnails of the photos only a name of the photos. Why? Thank you cabi43@hotmail.com
hi, ich hoffe, das wurde nicht schon 1000x gefragt: kann man auch bilder aus einem verzeichnis zb per php auslesen und mit imageflow kombinieren..?
Hola
Maby you can make Martin's idea by making the scrollbar big and transparent and than place it over the images, so you can drag it like Martin says. Just an idea. BTW, your script is very good, i'm still using it.
@ Philip: Nett, aber setz mal bitte um das imageflow div ein weiteres div, dass die Eigenschaft position: relative; hat. Sonst gibt es leider Darstellungsprobleme im IE und Opera...
Hey Finn, habe gerade dein Script ImageFLow in meine Community eingebaut ;) Als dank für deine hervoragende Arbeit wirst du mit deiner Seite im Impressum erwähnt vllt gibt es auch mal mehr irgendwan :P kannst ja mal vorbeischauen ;) http://www.creatixmedia.de
"OMODAKA is the name of the project developed through a trial and error process of mutational fusion of music and motion graphics. It will knock over your existing image toward a music video by a beautiful trajectory." - http://tinyurl.com/5plnkz
Music made ONLY with the windows XP and 98 sounds: http://tinyurl.com/235ysk
Yes, I can imagine that it may require a lot of work. Just thought it might be something special that would make it even more intuitive. But don't get me wrong - it's great as it is now! But it would be cool, wouldn't it?
@ martin: *Phew* I'd say yes, but(!) it'll be a load of work... I can't think of a easy way to accomplish that and that is a sign (for me), that it'll be not that simple ;D
Finn, is it possible to expand the effect so that one can not only flip through the pictures via the slider but also "moving the pictures" itself? Just curious.
I want one ;D http://tinyurl.com/49l33s
just to clarify, when i said change your gallery images, i literally mean switch them to new images with different names. that includes changing the html src and the actual images themselves. this makes the scrip 'reprocess' everything. its useful because you may have made the correct modification in your css or js and it won't be apparent until you do this 'reset.' at least thats my theory.
good news everyone! the imageflow madness in IE has come to an end. the issue was randomly solved after changing the gallery images!! i cannot explain why, but if you are having trouble in IE, makes sure that your css checks out (thanks Jeremy) and then change your gallery images. also, go the server and clear out any of the images created by the reflection php script. then reload the page and see if it works. if all else fails, copy my code. good luck. thanks for all your hard work finn!!!! cheers! -dave http://tinyurl.com/6bsuur
Hi, Ich wollte mal danke für Imageflow sagen :) ich habe es auf meiner Seite eingebaut...(mit mysql Anbindung)...einfach klasse! www.schlaegel-online.de Gruß Sven
hey guys i need your help, is there a possibility to make a hacked version of ImageFlow with lytebox so that i can open html files?
The ultimate viral mash-up? Music video for "Pork and Beans" from Weezer: http://tinyurl.com/5qnukg
Hi Jeremy, the reload issue is pretty far out of my expertise. I would guess that its an issue with the loading sequence. Post it so I can take a look. I have spent all day trying to figure out the "#" to "." replacement and I have had no success. What and where did you make the changes? In what file and what lines? Can you please post your exact changes? You may have the answer to this IE madness!! Here is the link http://tinyurl.com/45uexf
Dave, it was a "." not "a". And it was in the content area, but now I'm having some more issues with IE6 and imageflow. I have to reload the page it for it to work properly. Any idea why this might be? I really loathe IE6, it needs to be banned.
@ Jeremy: On the 9th, you said "Figured it out. It was an issue with Dave's CSS there was # before the content. I changed it to a . So now it works brilliantly! " In what css file should I change the #? and how can I incorporate the 'a' into the content? Basically...what did you do?? Thanks!!! ps.sorry i took so long to get back, i just finished finals.
Javascript/Canvas Textured 3D Renderer v0.2 (still too slow...) http://tinyurl.com/5rwbto
Finn, sorry to bother you again. It seems that there is a CSS bug in my implementation of ImageFlow and I just can't figure it out. In IE the images aren't where they are supposed to be (FF is fine, as always). It would help me a lot if you could take a look. CSS and me is a love /hate thing, but not so much love at the moment... The link is the same as on the 28th. Cheers!
ich eine Möglichkeit imageview einen Ordner mit Bildern zuweisen zu können ohne jedes Bild einzeln in den Code zu schreiben. Als Titel könnten die Schlagwörter dienen. So müsste man nur diesen Ordner zu weisen was bei 20-100 Bildern sehr schön wäre.....
Finn, OK, I got the handle issue pretty well handled. So check out my implementation of your script at my site. http://cinemasaville.com Check out the videos I think you'll enjoy it. My only question now is- What happens if I want to go over 100 images? Thanks again for your superb work with this script. It is much appreciated.
Finn, I just released my ImageFlow plugin for Wordpress. It needs another plugin installed as well, NextGEN Gallery. It gets the images from there. Maybe you want to add it to your FAQs. Here's the link: http://travel-junkie.com/geeky -stuff/wp-plugin-nextgen-image flow/
I am searching for a way to 1: archive and 2: present an advertising and design portfolio in a way that presents like Cover Flow. We would like clients to get an initial look at the ad image and then click on it to make larger. Is this what we are looking for. I'm not a designer but hunting around for advice, insights answers? We need the end viewer to simply view our work in the most dynamic presentation possible. We like the Cover Flow look and issuu is 2nd option.;
@ Christian: Orientiere dich an den gecenterten ImageFlow Demos (beachte auch den IE Hack im header der index.html): http://tinyurl.com/2y4vpw
Nice Interface ;D I parking 2002; digital video; 5'25"; by June Bum Park: http://tinyurl.com/yqxzr9 reminds me of http://www.golem.de/0805/59908 .html
Hallo Finn, ImageFlow schaut super aus ;) Ich habe eine Webseite, die mittig und nicht linksbündig ist. Gibt es eine Möglichkeit, ImageFlow in einer festen Größe mittig in meine Seite einzubauen? Gruß Christian
@ Andrew Cornett: Nice implementation, like it! I noticed a small compatibility/desing issue with your site using Opera. "across all photos →" of "Browse by tag, View Upcoming, or search across all photos →" is displayed in a new line...
@ Boris: No ImageFlow Thickbox version available at the moment... Concerning your other question: You can add any JavaScript in the HTML head after(!) including the imageflow.js and overwrite the conf_ variables. Yeah I already thought of compression...
@ Shaun Horine: No problem... and a donation is always welcome ;D
Hey, I've got another question for you, Finn. Is there a way to write the configuration variables in the head of the html-document, so that they take precedence to the variables in the JS-document? Basically, like it is possible to do with Highslide. That way you could compress imageflow.js as well...
at my page the pictures will go vertical not horizontal, why could be that? http://fredv5.franken-reggae.d e/index.php?module=Inhalt&func =viewpub&tid=5&pid=42&Location =Sophie (vergangene Veranstaltungen) and I got first error img_div.childNodes.item(array_ images[caption_id]).getAttribu te is not a function on line 86 what can that be? I do use also other javascripts like an accordion and google maps on that page to get somy moving eyecatchers,... so might be an namespace issue or has it something to do with my layout? greetings bernie
Hello Finn, I am working on a Wordpress plugin for NextGEN Gallery (another WP plugin). So far the PHP side of it is more or less sorted, but I hardly know anything about JS. I would like to be able to use different JS effects. Found the Highslide and Lightbox versions, so that's cool, but do you know of any Thickbox versions floating around? Cheers!
We did it! Thanks so much for an excellent script.
Finn, We are working to implement imageflow with our Goodbarry website. We are trying to use it without reflections and have removed the reflections command from the html code. However, it appears that no matter where we call for the "screen.css" it completely breaks the rest of our site. We love the script, just wish we could figure out how to make it work. We are trying to use it within another div on the page, could this be a problem? Any tips you might be able to give would be great. Here's the page url: http://willcutt.goodbarry.com/ archtops. Thanks again!
Nice script... It yould be great to see a hint to enable JScript if you have disabled it.
huw [at] oinkba.com would be great.. :)
Hi Finn.. We're trying to integrate the ImageFlow script with Jamroom MCMS and release it as part of our template range, we have over 1,000 templates in circulation, see http://oinkba.com "if that's OK with you". We need to be able to specify a URL after the "reflect.php?img=" is this doable?..
Very early start... but a friend and I are building a new kind of social website for people to rate and share their photos and audio. And one thing we did was included ImageFlow in their main profile pages. The response so far has been great! http://liveforfame.com/andrew
My BitFilm Favourite: ARTIFICIAL WORLDS v.3.0 http://tinyurl.com/5bn5sg
hi Finn, at first, my english isn't good ^^ i'm looking for an addon the image automaticly moved from right to the left. Is there any ready or can anyone mace it ?
Just manage it! Never mind. #imageflow{ margin-left:175px; margin-right:175px; text-align:left; } my solution
Hi Finn... Just can't, thru CSS, move the photos to the left... they always keep to the right :-S
Does Imageflow work in Joomla 1.5.x? Thanks
The total size of the effect is too much in width for my side - that results, that the images are flowing vertically up and down but not horizontaly reght to left... Any idea how i can size the comlete effect to fit in table with about 300 pix width ?
Sorry. Forgot the facts : Works perfectly on every browser except of IE... And the link again http://tinyurl.com/5nadto
Hi Finn. I'm here again :) Thanks for your answer, but i just tested your ideas but it doesn't work. Would be great if you or someone else here can look at my page... http://tinyurl.com/5nadto Would be great if you can fix it. I love your tool...
@ kuzjuxcan: Have you tried to include the imageflow.js as the very last JavaScript in the header? And your HTML does not validate, perhaps that is also a problem for the IE: http://tinyurl.com/4yq5r9
@ Ricardo & Jupp: That is the css behaviour of the IE. You can bypass/fix it by setting the left menu to a fixed width and float left. Then you need to define a margin-left with the size of the menu width for the content div container (which inlcudes ImageFlow). Or you can just try adding a margin left to your current layout, but I'm not sure if that works...
Hi Finn. I got the same Problem like Ricardo. Image flow works perfectly in Opera, Firefox and Safari.But in the IE, like in Ricardo's case, it goes to the left...
hi ive just implement it and it is working fine firefox, but in IE is all wack.. the last images are appear in massive format on the right when they should disappear. need help.. http://www.musicrocks.com.au/
@ Finn, i found some strange behaviour: The srcipt imageFlow Lightbox starts with the 5 picture, even there are only less than 5. Than it will move it all other pictures to the left. But why? Many thanks Dirk
Hey Luke. Ich interessiere mich auch für diese preload-Funktion. Kannst Du uns Deine Version vom Imageflow zur Verfügung stellen? Gruß, LennyB.
well i try to use this imageFlow. It works well but i've some problems to position the imageflow. i can't put it where i want, i don't understand what changes to do to do it, in css or in the imageflow.js ? it actually is in the middle of my page and i would like to put it at the top of the page.
Finn please help me, i have the code working weird, in Mozilla it works well, but in IE it goes to the left, i dont know why, can you help please, is there any hack or way to fix this plese help me Finn. You can test it in Mozilla and IE at http://tinyurl.com/6zjhzq
Finn, thanks so much, that really worked like a charm. The only remaining issue is how do you move the arrows closer to the line so there's not much space between them? And why does IE throw it off like it does? What's it's deal? But GREAT WORK! Really appreciated.
Thanks Finn :D sorry but i'm a n00b ;)
@ Finn, many thanks for your quick answer. Sorry for my bad explanation with the issues i have. Here is a link http://www.kempson.de/villa/in dex.php?lang=de&id=203 where you can sometimes see it. For any reason the pictures are aligned to the left and no one is in the middle which occures an Jaavscript error as "image_array[] is NUll". The second error is when clicking on a picture to bring it up into the lightbox i have issues with the special character like ä,ö,ü,ß. I have already defined them in the HTML code but they will still be shown wrongly. Hope it is clear now. Many thanks dirk
@ Werner, Jeremy and Did: This is just a small demo showing you what I meant by using the handle function. Look at the html sourcecode and understand ;D http://tinyurl.com/2lmeyt
Thanks a lot Finn, this will be a nice add-on to ImageFlow.
@ ichitaka: Simple CSS! Delete the margin-left:350px; from the #imageflow definition in your screen.css
can nobody say me how i center the script? http://www.play-a-3.de/store/
@Finn- I'm not a programmer, so where exactly in your script would I put this code, and where would the references to the graphic button go? I'm super excited to get this implemented, so it would be great if you could help me through. Thanks!
@ Dirk: A link to your implementation would be nice. And what exactly do you mean by "lightbox"? I am supporting ImageFlow, for any lightbox issues please contact the guy that coded it ;D
@ Werner, Jeremy and Did: I'll implement a next and prev button in the next version. Until then you can simply build yourself such buttons using the handle() function. Do something like onclick handle(1) for next image and handle(-1) for prev image...
Hi, many thanks for your free lightbox script which has been pretty nice implemented on my webpage. But for any reason i have some smaller issues. All pictures are generated by a php and a SQL database. - For any unknown reason your script does not show one of the selected pictures as the first pic so i will get an error within IE: image_array[...] isn't NULL or an object All pics have an description which will be assigned to the alt attribute. Within IE i the Lightbox shows errors when using special character like ä, ö or ü. Firefos doesn't have this Problem. I hope you can help me in both cases as soon as possible. Many thanks Dirk mail: shungo73@arcor.de
ok i found a way to use imageflow in my wordpress. but how do i center it?
No, that must be it. I'm still running 1.3.2 (v312.6). Will upgrade and will let you know if that is not it. Cheers! PS> I would also like to add my vote to Jeremy and Did's for "two arrow on both the side to make it more user friendly"... that will be great.
@ Werner: Have you updated your Safari to the latest stable release? I am running Safari 3.1.1 on a windows machine and the glideTo function works fine... Can you please post your version...
From the FAQs: Is it possible to start the gallery at a picture defined by the user? Yes... This does not work with Safari Browser using my script glideTo( -1050, 7). It works fine in FF and Explorer. Any advice? PS... thanks for a great piece of software.
Neat GPS Program for your mobile running Java and BT... http://vlkgps.bielyvlk.sk/
Thank for your kind answer Jeremy, this is almost exactly the principle i was looking for! I will also dig to figure it out how it works.
@Did: I myself am trying to implement this hack... http://jalbum.macosxsupport.co m/imageflow.html Not being a programmer myself, it's going to be a challenge to figure it out, but at least there's a model. So maybe someone can help us out, in the interim I'm going to give it a go.
Hi guys, When I change the css script to edit the size of the imageflow and put in the width for 700px it is centered just fine in IE but in firefox it sits to the left , any suggestions Thanks
Why your implementation seems so freezy ? is it an option to reduce the speed ? thx for your work ;)
Unfortunately, I'm very far to be skilled enough at coding to get any value of this link for my own purpose. Thanks anyway
"you're using Javascript to do what?" No need to say more: http://blog.nihilogic.dk/
One more thing, does it any trick to make the modified reflect.php (transparent reflections) IE6 compliant? (unfortunately, still a common browser...)
Hello there, ImageFlow is a awesome script, but I miss two arrow on both the side to make it more user friendly. That would be a great add for future release ;) (or even better for the time being, if somebody could help me with a existing hack it would be really cool). Cheers
ok i found a way to use imageflow in my wordpress. but how do i center it?
@Finn: Figured it out. It was an issue with Dave's CSS there was # before the content. I changed it to a . So now it works brilliantly! Thanks. Now here's my question, I want to change your slider to the one from the Mooflow. It just looks better, and seems to be more intuitive with the arrow handles. Here's a link: http://jalbum.macosxsupport.co m/imageflow.html How would one do this? Thanks for the excellent work. Come enjoy my films at http://cinemasaville.com
@ blubb: Nice! But It is still not 3D ;D Currently I work with VVVV and I heard rumors, that those guys developing it work on a processing node. Meaning it'll be possible to use java based processing code within the graphical programming interface of VVVV. Would be cool ;D - http://vvvv.org/
@ Tom: Try setting the img to something different than position:absolute; (global img definition in the screen.css)...
Thanks for the comment Che, I have been playing with the .js file with no luck. I am hoping to find a way to use the menu vertically using the up and down keys to move the images. I am no css expert but will find somone who is! Thanks
Tom, yeah, it's definitely possible. Experiment with the .css file. I did this a while ago, but I dob't recall how i did it :D I'll write how it can be done as soon as i remember. It was something with completely removing 1 of the div's.
Hello, Many thanks for your work on the current image flow,is it posible to orentate the images vertically rather than horizontally? Tom
Hello. Can anyone please tell me, how do I center imageflow? I've got a hard time putting it in a blocktable. Edited the #imageflow in every way possible, but nothing seems to work.. Please at least give me a tip. Thank you.
@ Jeremy: ImageFlow 0.9 should work bugfree with the buggy IE 5.5+. Do you have a specific problem?
@finn: Have you gotten anywhere on the ie optimization of the script? Danke
@Matt- Hey, if you're still out there, would love to ask how you implemented this in Drupal. I think there must be a better way than how I'm doing it. email me at jeremy at cinemasaville dot com. Thanks.
Got the pop up window working just need to figure out how to make it 480pixel by 480pixels
@Finn "@Finn" I ment to put my name in , sorry
"Try the following: Replace document.location = this.url; in the imageflow.js by window.open(this.url, '_blank') ;" This I've done that here at the zindex { window.open = (this.url,'_blank') ;}break; ****AND HERE***** "Set ondblclick event" image.ondblclick = function() { window.open(this.url, '_blank') ; } ---here is what I have http://getthecool.com/test/ima geflow.htm nothing happens And this is what I would like the popup to look like http://getthecool.com/test/new window.htm Thanks you for the code and sorry for being a n00b
bez. meinem eintrag: die ursache des problems war, dass image.h und image.w noch nicht gesetzt waren.
HI I am working on a version with FLIP so if the developer of this ImageFlow script is interested in how I am going to do this please mail me at mhmk@hotmail.de (YES I am from germany ;D )
@Frank my brain is bleeding I'm having a real hard time trying to get the page to open in a new window. If I need "google" to open in a new window do I create javascript on the server to open all anchor tags in a new window Thank you p.s If you have a link to your page I would love to see how you did it thanks again
Does anybody here know how to change out the slider and scrollbar like this guy did here? http://jalbum.macosxsupport.co m/imageflow.html I think it's the perfect combination. So let me know.
I guess Finn wanted to know when my implementation of his lib is live. It is now on the site: for example here: http://tempus-vivit.net/fotoal bum/Esca/134060
hi finn, erstmal vielen dank fuer die super imageflow library. ich habe versucht eine ajax preload funktion einzubauen, so dass einige hundert bilder mit imageflow angezeigt werden koennen und der benutzer nichts von dem nachladen der bilder merken soll. im grunde funktioneirt das ganz gut. die naechsten bilder werden im hintergrund mit ajax geladen, eingefuegt und anschliessend die refresh methode aufgerufen. das problem ist, dass teilweise die bilder nicht richtig angezeigt werden (sie werden nicht verkleinert und erscheinen am oberen rand). habe das gefuehl, dass das damit zusammenhaengt, dass einige bilder noch nicht fertig geladen sind und zu frueh auf visible gsetzt werden. hast du eine idee wie man das loesen koennte? und hast du schon daran gedacht eine ajax preload funktion in imageflow einzubauen?
Hot Chip - "Over and Over": http://tinyurl.com/4k8fje
Dave, thanks for the changes. That fixed most of the core Drupal themes. With a little tweaking, I got it to work with the Garamond theme as well. I'll keep tweaking to see if I can fix it for the rest of the themes. Jeremy, I would like to release a module. I just need to work out some of the kinks first. In the mean time, you might try applying some of the tweaks in Dave's stylesheet. Specifically, the parts in the #main section seem to do the trick.
Hallo repariert Finne, der sich Nur fragt, wenn Sie im dürften stellen können, für die senkrechte Höhe in IE Ich fragte mich auch, wie Ein ausführen dürfte können eine Bildlaufleiste die Pfeile auf entweder beendet gehabt hat, dass ein Verbraucher anklicken könnte, die Bildnisse so oder so zu bewegen. Danke!
Hi, wirklich sehr geil das Image Flow, leider verstehe ich nicht ganz, wo man was ändern muß, damit ein Zufallsbild am Anfang ausgewählt wird, wäre echt super, wenn das etwas genauer auf der page beschrieben werden könnte. Vielleicht kann ja hier jemand helfen. Danke schonmal!
@Finn: Danke :) Auf die Idee bin ich noch garnicht gekommen die reflect.php?img= aus den img src zu entfernen :-) Wenn ich jetzt noch wüsste, wie ich das Main-Image größer kriege, und die nicht fokuces Bilder kleiner, wenn ich var conf_focus = 2 setze. Denn das bleibt leider immer gleich groß, und ich will den #imageflow-Div nicht breiter machen müssen :(
@ basti: Lass einfach den part "reflect.php?img=" in den img src weg. Und setz die var conf_reflection_p in der imageflow.js auf 0...
Hi, kann mir jemand verraten, wie ich die Reflektion komplett deaktivieren kann? Sodass nur meine Bilder zu sehen sind, ohne Spiegelung? danke :)
Thanks Frank Thank you
Thanks Finn!!
@ Dave: Hmmm, I have to optimize that... Please use http://tinyurl.com/ to make any url compatible to my buggy shoutbox ;D
i keep missing the spaces in the url in the small text editor haha http://www.reachoutdesigns.com /test/screen.css
oops... http://www.reachoutdesigns.com /test/screen.css
Hey Matt, I tried to make a few changes to your screen.css. Hope it helps! http://www.reachoutdesigns.com /test/screen.css
Hello, I' having a problem with the vertical placement of the 'imageflow'. In mozilla, it works PERFECT. In IE7, it stays a the top of the page. http://www.reachoutdesigns.com /attempt/mozilla.html http://www.reachoutdesigns.com /attempt/ie.html In the IE version, I added an upper margin: #imageflow{ text-align:center; margin-top:250px; } My question is, how do I script it so that it has a margin in IE7 and not in firefox? Or, how do I avoid having to script a margin hack, and have the images be in the same place in both mozilla and IE? Any advice would be appreciated! Thanks!! -dave deriso [at] gmail [dot] com
@Matt: Hey Matt, I would love it if you could create a Drupal module for this. Currently, it's working like a dream on my Drupal 6 site, except on IE 7. You can check it out here: http://cinemasaville.com/image flow Let me know if you have any luck getting it working on IE, that would make life a whole lot simpler for all of us.
Hey Dave, I typed that into the screen.css, but still having issues with ie7. Is there supposed to be a "." in front of clear & img_Ink?
@Casey: In order to open the image in a popup I call a javascript (popup.js) with the image as parameter as longdesc entry. longdesc="Javascript:GrafikPo pUp('location/name of the image to display')
Hi Matt I was having the same trouble with centering the image in ie 7... to fix the centering in ie, try pasting this into the 'screen.css': .clear{ position: relative; clear:both; } .img_lnk img{ position: relative; } #main{ min-height:100%; text-align: left; margin: 0 auto; max-width: 1000px; position: relative; background-color:#fff; padding: 0px 0px; } it worked for me..
I'm working on integrating Imageflow into Drupal, but I'm having trouble with the images appearing outside the containing div under certain themes. At the moment, I'm focused on getting it working with the Garamond theme (currently working fine in Firefox, but broken in I.E. 6 & 7), so I can use it on a specific site. Ultimately, I'd like to get it working across various themes, in the hopes of releasing it as a Drupal module for others to use. I set up a demo site with a theme switcher, so you can see what's happening: http://minezone.dreamhosters.c om/d5sandbox/ Any ideas on getting it to work, especially with Garamond? Thanks!
Okay, I have the images centered but I still would love to know how to have the image open in a new window Thanks again
i'm using wordpress 2.5.1 and want to use imageflow. so i write the scriot into my header of my theme. now.. where the imageflow files must be? in the same folder like my theme?
Thanks
Simply go into the CSS file, and where it says: } #imageflow{ margin-left:350px; text-align:left; Simply change it to center, and change 350 to 0. That should work.
When I have it loades it wants to load to the right side of the screen. What should I do to center the images??? Thanks again
I'm with frank on this one. love to code and everything you are doing but I would like to open the longdesc url in a separate window. I would also like to open the new window without address bar or scroll bar and 480pix by 500pix. thanks again for any help, keep up the great work!!!!
i'm using wordpress 2.5.1 and want to use imageflow. so i write the scriot into my header of my theme. now.. where the imageflow files must be? in the same folder like my theme?
Speaking German
@Psksx1: You could also try out ImageFlow with EnlargeIt! - see http://enlargeit.timos-welt.de /enl_iflow/
I've had a number of issues reported on my forum when people started using your imageflow with my lightview. Please fix up your css, prefix everything with #imageflow so it can safely be used with other products. CSS rules like: img { position: absolute; } are extremely bad practice. Thanks.
@Psksx1, you either can try Finns demo of the Lightbox compatible imageflow: http://194.95.111.244/~countze ro/scripts/_myImageFlowLightbo x2/ or my version which uses prototype as lightbox does: http://blog.hma-info.de/2008/0 4/16/imageflow-revised/
I downloaded it, but I have no idea on making it work, can u help?
It is are real great script and I tried to use a URL instead of a picutre in the longdesc parameter and that works well. However, I would like to open the longdesc url in a separate window.
Hi, I found the imageflow Code and it's awesome... I was trying to make it work with LightBox but it doesn't work, how can i make it work with lightbox by clicking the image and make it open with the Lightbox effect? Im Sorry my english is not so good. Hope You understand. Thanks!!! psksx1@gmail.com
@GP no it cant, but its also no flash :-)
Its a great script , but can it also show html forms like http://dougmccune.com/flex/cov erflow/flexcontrols/CoverFlow_ FlexControls.html
Hello with all and all. Here I regulated the problem of posting of the images in script but I have another problem. When the user clicks on one of the images, the mention “loading” appears but the image does not take care in full screen. Example: http://www.club-leparadis.com/ 260408.html For explanation, the 260408.html page points another page (alb260408.html) through a iframe. If somebody could find me the solution because there, I acknowledge that I do not see where is the bug. Thank you for your assistance, I need some.
First, thanks for the great work on ImageFlow. I also want to reduce the vertical space that ImageFlow takes up. I read the earlier message explaining the need for the extra space for EnlargeIt. However, I'm using the HighSlide version, so there is no need for the extra vertical space on the page. How can I remove sll the extra space above the images? Thanks.
OK, I got it working, kind of..., but the CSS is screwing up the page, any ideas what settings to fix? Here's the link: http://CinemaSaville.com/image flow Any help would be appreciated by anybody knowledgeable.
@pdca: Oh, I just realized that the iframe won't work, because the image links open in that iframe, and not in the main area of the site, so it's kind of useless. Any info on how to make it work in the main Drupal section would be greatly appreciated. How did you do it in Joomla, and do you have a link?
@pdca: I really need it to fit into a smaller space on my Drupal page, so I need the height tightened. What can I do? There must be some way. I'm going to set all my pictures to a set height.
Guten Abend, Ich stoße auf ein Problem mit Imageflow auf dem Laden der Fotographien im realen Gesicht. Tatsächlich, wenn man an eins der Bilder irgendwie klickt, erscheint die Mitteilung „Laden“ auf dem Schirm, aber nichts tritt auf. Konnten Sie mir helfen? Danke.
@Jeremy: I saw, the program would not take the tags, again: remove the break tag below the body open tag in the index.html.
@Jeremy, first, remove the tag below the tag in the index.html. 2nd: the height is needed, in case you want to expand the pictures with EnlargeIt. If you have a landscape size of let's say 510px x 340px or Portait 340px x 510 px and you expand them, then they will perfectly match within the given space without overlays or cuts on neither on the top nor on the bottom(where you may have text)
@pdca: Thanks so much for the tip. It's in there, but I can't figure out how to change the css to cut out the excess room at the top so it looks good on my site. Here's a link: http://www.cinemasaville.com/i mageflow.html
The link is true. I don't understand. please heeeeelp :d
@Jeremy: I also tried hard to get it into another CMS, Joomla, finally I managed that, but it was really very hard, so a much easier way would be to include it as an iframe. Drupal should have, same as Joomla, a Wrapper function, then you just load the package to your server and in Drupal call the wrapper function to point to the index.html of the imageflow package. I finally decided to do so, because I will also avoid possible scriptconflicts.
@ eropolis37: Very simple: The image links are wrong... meaning they do not link to existing images. Check http://www.club-leparadis.com/ photos/020208/P1030629.jpg
Internetseite : http://www.club-leparadis.com/ 020208.html
Internetseite : www.club-leparadis.com/photos. html
Hallo, Ich habe gerade Ihren Index ImageFlow 0.9 auf meine Internetseite angebracht, aber die Bilder werden nicht richtig bekannt gegeben. Ich überprüfte gegossenes PHP und GD, aber es ist nicht das. Konnten Sie gehen, meinen Aufstellungsort zu besichtigen, um über dem Problem zu berichten Ihnen und Ihre Unterstützung zu mir vorzuschlagen. Mit allen danke.
I can not open the ImageFlow_0.9.rar file on my Mac. Can you send me a link to a zip file...I have tried everything...nothing works. Thanks, Angie
Ok, solved the opacity thing.. however i got to thinking.. is there a mouseover effect in this script or should i be looking at making one of my own? I would like an image to increase in opacity as the mouse moves over it...
Thankyou Finn.. I never thought about it like that... sorry to ask this, but as i am a decent coder, but really new to js. can you point me into the right direction as to how i would accomplish an effect.. i can see serveral obsticals I would need to identify each image and as it slides away decrease the transparency and increase on the image coming forward.. any help would be greatly appreciated here...
Hi, Finn- Thanks for creating this awesome script. The only problem is I can't get it to work. I have a Drupal site, and for some reason it's not working at all. Any hints on how to get it working? Thanks..
@ TinyTim: You can change the opacity: http://www.quirksmode.org/js/o pacity.html
Hi. Is there any chance that a "blur" effect can be added to the pictures not selected? so that besides moving to the side they also get out of focus (i.e like you can do in flash)
*muhahaha* http://tinyurl.com/6n7gsw
Is it possible to have some kind of live photo filtering through a javascript function. It would be nice if you could type some text into a text box and it would start showing only images that matched the text against the caption, or possibly even a new Keywords tag.
Soooo, was lange währt... Imageflow 0.9 mit Enlargeit 0.92. Demo: http://enlargeit.timos-welt.de /enl_iflow/ Download: http://enlargeit.timos-welt.de /enl0902_iflow09.zip - Viel Spaß damit!
@Timo: ganz ehrlich? gar nicht ;-) Ich probiers aus dass alles korrekt dargestellt wird. Bei mir ändert sich der Inhalt nicht so oft. Bin mir nicht ganz sicher, aber wird der Bereich nicht automatisch vergrößert, wenn nicht alles rein passt?
@Tom: Das Problem kenne ich, taucht im Opera genauso auf. Wie berechnest du die notwendige Höhe des DIV?
@pdca:I already tried that and it opens the link but only in the same window. Is there any way to have the e.g. http://mysite.com/index.php opened in a new window? Thanks in advance
@Frank: the blank between c and om needs to be deleted of course, thats because of linebreak here
Ich hab mein Problem selbst gelöst. Ist vielleicht nicht das beste, aber wenn ich einen div mit einer festen Höhe darum leg, funktionierts. Trotzdem danke!
@Frank, yes, just enter for the longdesc expression: longdesc="http://www.mysite.c om/index.php" (or index.html)
@pdca, @all: sieht meine seite bei noch jemandem so aus: http://der-tom.de/bilder/error _ie7.jpg oder so http://der-tom.de/bilder/error _ie7_2.jpg ? Hatt jemand ne Idee warum das nur bei mir so ist? Habe auch schon tausendmal den Cache des IE geleert. Ich weiss echt nicht mehr weiter. :-(
@pdca: Thanks, that works very well for images. I am planning to open a html page (in a new window, a specific frame or as popup) when clicking on the reflection image. Would that be possible at all? Thanks in advance
@Finn: I just thought, if it could be interesting for a future version of highslide-imageflow to include the possibility to set the choice to either the highslide enlargement or a weblink for the longdesc entry. I tried it when I answered Frank's post, but unless I made a mistake, you can only enlarge to highslide, not to another link, or am I wrong? So if you want to set longdesc to a link, you need to use the regular imageflow version currently, correct?
@Frank: link: enter webpage link in longdesc expression popup: see today's 02:54 post from Tom enlarged: use imageflow-highslide version
... or in a frame
Hi, I mean a link to another site. But the site should open in a new window or a popup... Thanks in advance
@Frank: what do you mean bei new window? As a link to another site or as popup, or just enlarged?
Hi, is ist possible to open the selected picture in a new window? Thanks in advance
@Tom Bei mir sieht das im IE7 und FF identisch aus...
Hi! Ich hoffe es kann mir jemand helfen. Das Script ist super, aber wenn ich es im IE7 anschau, dann sind von meinen 7 Biloder immer die letzten 3 viel zu groß. -> http://der-tom.de/tuerkei.html Alles andere passt eigentlich super. im FF siehts top aus, so wies halt sein soll. Weiss jemand an was das liegen könnte? Danke+Gruß Tom
@Finn: I made it.. I changed it to #imageflow #loading and #imageflow #captions so now it works! I noticed, that these adjustments are necessary for table based layouts, not for completely tableless layouts. Finn, it's perfect: Imageflow combned with highslide and equations effects... I'll send you the link to your google email adress. Thank you so much!
First results of my current project: http://tinyurl.com/632ool
@ pdca: I suggest that you try the same with the #loading (change to "#imageflow #loading") Or you can rename the div. BTW: Can you post a link to your implementation?
@Finn: Perfect! That solved it :-) In the various posts here I noticed others had the same problems, so may be it could be a good idea to incorporate this in the next version of imageflow. Now only one little thing is still open: the image description (for example image_1) which normally is centered above the white line, always appears left. I assume that it could be the same problem as in the img case. The same is with the display of "loading images" incl the loading.gif, and the display of the calculation of the numbers of images, it's all fixed on the left border.May be you have another perfect and quick solution as in the img case, because changing settings to center or so didn't provide any successful results. Thank you so much, Finn, imageflow is such a great slideshow and really looks cool!
@ daniel: Kann man bestimmt... frag aber bitte nicht wie und wo ;D Es ist zumindest etwas kompliziert und da musst du dich erstmal reindenken...
Jepp simply replace "img" in the screen.css by "#imageflow img" and make sure, that you include the screen.css after the other css files.
@ceasar. Thanks for your reply, but I had set a wrapping element around imageflow already before, as recommended in earlier posts in the shoutbox here, but it didn't solve the problem. Meanwhile I found the problem, but I have no solution. In the template I use there is another element img defined in the template.css, and so img in the imageflow.css is not unique and therefore always will cause problems. For anyone, I assume, having the img element already defined somewhere else -it is a very common element for many templates- and mostly defined in the general css, will encounter these problems. I am not an css expert, but from what I know, it is necessary to define the elements and selectors to be clearly unique, as it is done in the highslide css. @Finn: do you think, there is a way to define and assign uniqe elements and selectors for imageflow? Thank you so much!
Hallo! Image Flow ist genial, habe aber eine kleine Frage: Kann man irgendwie die 'nicht fokusierten' Bilder links und rechts noch kleiner darstellen lassen, sodass das Hauptbild größer wird bei einer festen Div-Breite?
@sorry, sorry Casar, it should have been pdca to TO Ceasar iso ceasar in the header of the 15:45 post ... with delay.. mail just sent to you. In the mean time, aside 3 medium/minor issues, I could include highslide with imageflow (including the R.Penner equations) successfully into Joomla 1.5.2 :-) Still I have the problem with the absolute/relative position even with another div wrapped around
... with delay.. mail just sent to you. In the mean time, aside 3 medium/minor issues, I could include highslide with imageflow (including the R.Penner equations) successfully into Joomla 1.5.2 :-)
@ Michael K: You have to encode the special chars to HTML Entities. Use the following link to let a script do the work: http://centricle.com/tools/htm l-entities/ BTW: That's FAQ #7 ;D
Hi, how can I use special characters like danish Æ, Ø and Å with Imageflow + lightbox? Check this site http://www.louisemaagaard.dk it shows a lot of weird characters, but only in IE? Thank you.
thanks guys, you are wounderful!! Cillian ps. sorry for the late reply
@ceasar, sorry I didn't reply earlier, but I was trying so hard to understand the imageflow dependencies and to make it, until now. And ..I made it :-) ... nearly, imageflow now is working within Joomla 1.5.. That was really, really hard, because Joomla is very tricky and special with these things. Another challenge: imageflow generates a script conflict with shadowboxJS. The only open issue now: to get highslide working together with imageflow. I will send you the weblink by mail later today... Thank you so much for your support.
Windows XP SP3 Yields Performance Gains or why I stay with XP ;D http://exo-blog.blogspot.com/2 007/11/windows-xp-sp3-yields-p erformance-gains.html
version 0.93 ? http://www.recursive.nl/oss/im ageflow/test/ Verty interesting the big comments at the left. Denis
Send it to info@cfconsultancy.nl
can I send you the link to some address outside this forum, may be you are a forum member somewhere so I can send a private note
@pdca Do you have a link so I can see the results ?
@ceasar I can report at least some minor progress. With your snippet, the pictures started to show: reflected, original size, one below the other, no gallery or so, but something happens (before: blank screen). The unfortunate thing: That only works with the screen.css deactivated, as there is a conflict somewhere with the highslide.css, which I copy/pasted from the original and deleted the general css markups as that would destroy my overall css. This highslide.css is correct, as my sample highslide gallery works perfectly. Another problem: the loading.gif remains persistent.
@Ceasar: Thanks a lot for your reply. I will try to use your snippet and I will let you know if I was successful :-)
@pdca For the onload problem use this snippet than add the image flow js at last before /* Hide loading bar, show content and initialize mouse event listening after loading */ function startimageflow() { if(document.getElementById(co nf_imageflow)) { hide(conf_loading); refresh(true); show(conf_images); show(conf_scrollbar); initMouseWheel(); initMouseDrag(); /* 5 is 5de plaatje -x is 5 x 150 */ glideTo( -750, 5); } } function addLoadEvent(func) { var oldonload = window.onload; if (typeof window.onload !== 'function') { window.onload = func; } else { window.onload = function() { if (oldonload) { oldonload(); } func(); }; } }
Vielen Dank, Finn, für die schnelle Antwort. Habe mittlerweile Mooflow einbinden können (das war sehr einfach), aber das ist GAR KEIN Vergleich mit Imageflow, Imageflow in Kombination mit HS ist einfach nicht zu übertreffen. D.h., wenn ich Dich richtig verstanden habe, muss erst der WinOnload Funktionsaufruf aus dem .js herausgelöst werden, damit es funktioniert? (Ich hatte mich bereits gewundert, dass in den Bsp. der Aufruf gefehlt hatte, und habe dann gesucht und ihn dann eingebettet im .js gefunden. D.h. ich werde (ungeduldig :-) ) warten müssen, bis die Separierung in einer neuen Vers. realisiert ist... Vielen Dank!
http://www.zshare.net/download /1107828610ffef62/ this is my dirty hacked oop-implementation based on version 0.8, there are bugs and unimplemented features (keynavigation, ...), but also contains ajax-support by using adobe spry-datasets as parameters, using div-elements as container for the app maybe some js-expert can clean the code for us
@pdca: Das liegt daran, dass ImageFlow in der Version 0.9 noch nicht vernünftig gekapselt ist und das window.onload event zum starten benutzt. Wenn du nun irgendwo nach der Einbindung des imageflow.js nochmal einen window.onload Eintrag definiert hast, dann wird der von ImageFlow überschrieben und es passiert... nichts.
Versuche seit Tagen, imageflow 0.9 hs compatible in joomla 1.5 zu integrieren. Der HS Part funktioniert tadellos, habe sogar die equations Erweiterung von R. Penner erfolgreich eingebunden. Nur mit imageflow selbst will es nicht funktionieren. Habe es mit einer anderen (kein CMS) Webseite testweise probiert:kein Problem, die Ausrichtung stimmt zwar noch nicht, aber das Script funktioniert. In Joomla wird das loading.gif von imageflow geladen,danach bleibt die Seite leer. Wo könnte das Problem liegen? Bin ratlos :-(
mir gefällt das Imageflow, nur leider bräuchte ich das mehrfach auf der Seite (ohne Iframe), denn sonst fragen die User wieder warum ist hier so ne nice Funktion und da nicht,... ;) Vielen Dank für den imageflow aber ich warte auch schon sehnsüchtig auf die nächste Version! ich hoffe Du findest die Zeit! gruss bernie
Hola
@Frog I like my Protoyped version of Finns Imageflow. Basically kept everything as it but used the Class and Event mechanism. :-)
@Finn: hab den js-Code der extension mit dem offiziellen von dir ersetzt. Bilder werden nicht gecached. funktioniert in FF aber wunderbar.. warum in IE nicht?
@ Frog: MooFlow is a ImageFlow implementation using the Moo something Framework and is NOT lighter! If you want it rock solid crossbrowser compatible and light(js is 12kb and can be shrinked to around 6kb) you choose ImageFlow. And I think, that the animation is somewhat smoother with ImageFlow... If you want everything to slide in and out and let you wait before you can interact: choose mooFlow ;D
Now I've seen mooFlow I see that it's the same as ImageFlow with some more things in it (like slideshow). One of the pro's of mooFlow is that it is lighter. What are the pro's of ImageFlow?
@ giogio: Du benutzt nicht die offizielle Version, sondern eine Typo3 Extension, richtig? Vielleich hat der Autor der Extension da was im JavaScript "vermurkst"? Meine letzte Idee dazu wäre noch, dass du mal den Cache wo die generierten Bilder reinkommen mal leerst bzw. mal überprüfst ob die Bilder überhaupt gecached werden...
hm, position:relative bringts auch net. aber ich versteh nicht, warum die höhe nur bei den letzten paar Bildern nicht richtig berechnet werden kann. und warum das mit den css eigenschften zusammenhängt.
@ Kay: Kann man machen... ist aber mit Nachdenken verbunden ;D Ich würde es folgendermaßen lösen: Die breite des Sliderbalkens bestimmen, dessen Position relativ zu der gesamten seite. Dann bei einem onclick auf den Sliderbalken die Mausposition mit der relativen Position des Balkens verrechnen und dann noch einen kleinen Dreisatz um die passende Bild ID dafür zu bekommen uuuuund dann mit der glideTo Funktion dahin springen... mach mal ;D
@ giogio: Bette mal den ImageFlow div container in einen weiteren div container ein, der die Attribute position:relative; hat. Vielleicht hilft das...
@ Timo(oZ): Hehe, der Link führt zu meinem Arbeitsverzeichnis: "_myImageFlowTesting" eben... da ändert sich manchmal was ;D. Aber das Prinzip ist da auch das gleiche...
@ Philby: Das ist doch mal ein schöner Komment ;D Sieht übrigens super aus die Seite für den Schweizer Fuchs Verlag ( http://tinyurl.com/5mszj4 ) gefällt mir! Danke für die Spende.
peinlich, peinlich... die Tinte des Kommentars ist noch nicht mal trocken, da springt einem schon die Lösung auf derselben Seite ins Auge. Also: Problem erledigt.
Hey, just found a "hack" that prevents small images to be resized above its original size. depending on the images in the gallery it might cause that the nonfocused images are larger than it but it really helps image quality. Feel free to comment or use :-) var w_space = 0; if (new_img_h > image.h || new_img_w > image.w){ new_img_h = image.h; w_space = (new_img_w - image.w) / 2; new_img_w = image.w; } image.style.left = xs - (image.pc / 2) / z * this.size + this.images_left + w_space +'px';
Zuerst Mal: herzlichen Dank für das tolle Script! Macht wirklich Eindruck und Freude, das Teil (habe diesen Gefühle soeben auch monetär via PayPal einen kleinen Ausdruck verliehen ;) Nun ist es aber natürlich wie immer so, dass die Herren aus Redmond irgend ein eigenes Süppchen kochen müssen, und die Darstellung in deren sogenannten Webbrowsern irgendwo scheitert: die ImageFlow-Gallerie wird (bei mir) im IE leider nicht zentriert, sondern klebt immer mit einem fest definierten Margin links am Bildschirm... was bei hohen und höchsten Auflösungen gewöhnungsbedürftig aussieht (auf http://www.verlag-fuchs.ch). Ich vermute dass das sicher schon ein cleveres Programmiererkerlchen bemerkt und einen entsprechenden Hack bereit gestellt hat... nur finde ich den nicht. Kann mir da jemand auf die Sprünge helfen? Vielen Dank + gruss, Philby.
@Finn: Einige Benutzer des LightFlow skins (http://jalbum.net/skins/skin/ LightFlow) meinen, dass es nett waere auf den Slider-Balken klicken zu koennen, um den Slider an diese Position zu setzen anstatt ihn per Drag&Drop dorthin ziehen zu muessen. Ich finde diese Idee auch sehr reizvoll. Was meinst Du dazu Finn?
@Timo (oZ) diese version funktioniert bei mir nicht in FF und auch nicht in IE ..? strange
@giogio: Auf Anhieb habe ich es nicht genau erkannt aber ich glaube Du benutzt nicht die IE-Hack Variante für zentrierte Layouts: http://tinyurl.com/2lmeyt @Finn: unter dem Link ist der IE Hack zwar vorhanden, die Version scheint aber mittlerweile nicht mehr ausschließlich den IE Hack zu behendeln, oder?
Hallo Finn, erstmal ein riesen Dankeschön für dein Script. Ich habe viel Freude damit.nun meine Frage: ich habe Darstellungsfehler im IE7 :( und finde den Grund dafür nicht. In FF klappts super. Könntest du mal einen Blick draufwerfen? http://tinyurl.com/5b4c4s Danke und Gruss
@ Denis: You don't need to install anything, just copy it. All you need is having a PHP server up and running, which is done by the nice people you pay for hosting your stuff ;D I thought about JavaScript reflections, but since PHP genereated reflections are very performant I did not try to implement those... Concerning your title + description: Simply use some HTML. See the FAQ #7 http://tinyurl.com/2wph54
Above the scoll line there is the Alt description. It would be good if an additional info be added by the "Title", just above. We would have 2 lines. A title and a description of the image. For the js reflect... I cannot do that. I said that because everybody cannot instal your application on a php or asp server. You are very talented. Denis
@ Bobby: There is already a part in the imageflow.js where you can define different functions for rhe focussed image only. Read from line 160 following: http://tinyurl.com/yss9hz
@ Denis: Is perhaps possible... you can try it ;D What do you mean by a title above the alt descr.?
Hey there. Well done on a fantastic script. I was just wondering. Is it possible to have an onImageFocus call function where once an image is in the centre (the focused image) it can call a javascript function. Maybe have it as an attribute to the img tag [img src='blah' onimagefocus='javascript:some function()'] At the moment it seems you have to use either the arrow keys or click on an image to get it in focus and then click on it again for it to do something else. Thanks.
Dear Finn, 1-/ About the php reflect, it is not really possible to have a javascript reflection as the mooflow version ? : http://www.outcut.de/MooFlow/ 2-/ How obtain a title just above the Alt description ? Thanks Denis
Sorry, for the downtime (>48 Std.)...
hi finn! großartiges teil ... habe es bei die-lounge.at eingebunden und funzt toll! ... ich benutze eine angepasste highslight-demo und wollte versuchen html content ebenfalls per highslight einzubinden allerdings scheitere ich immer wieder an js-fehlern habe in deinem imageflow.js gesehen, dass du einige hacks eingebaut hast um die beiden lösungen miteinander zu verbinden und wollte fragen ob du mich evtl unterstützen könntest. danke + lG aus Wien kajdo (kajdo0815 [at] gmail.com)
@ agtd: Hmmm... sometimes it's hard to simply answer "RTFM!" ;D Check the FAQ #4 http://tinyurl.com/2wph54
@ Christian: Super, danke für die Spende! Sehr schön so seinen Tag zu beginnen ;D
@ GnuShi: ImageFlow is free as it is. Although I recently had some thoughts about distributing it under a gnu license... Since I believe that content is free and will always(!) be copied via the internet ImageFlow will be used for any purpose, modified and duplicated - No matter what I do! I knew that from the date I puplished it and it's fine with me. But I am not naive: I would not like to see it beeing used for illegal images (childporn etc.)... You can use it for commercial projects and rewrite it to fit your needs. A linkback on the imageflow site or even a donation are very appreciated ;D
I am using imageflow and it is awesome. Is there anyway to have transparent backgrounds on the images? Thanks Tom
Danke Finn, das meinte ich mit "in eine Richtung lenken". Ja, es ist immer noch ein Vorteil wenn man des Lesens mächtig ist. Aber es gibt Sachen, die sind zu einfach, um selbst drauf zu kommen. Also nochmals Danke. BTW, Deine Spende hast Du Dir wirklich verdient und solltest Du auch schon gutgeschrieben bekommen haben...
Could you tell me about the license? May I sell this software? Use for any purpose, modify and give away the modified versions?
@ Christian: Du benutzt eine alte Version von ImageFlow (0.8?). Wenn du auf Version 0.9 updatest sollte das Problem nicht mehr auftreten. Siehe dazu auch http://tinyurl.com/2jfwwb Wie siehts eigentlich mit einer kleinen Spende aus ;D
Hi Finn, zunächst vielen Dank für Dein Imageflow. Es ist mit Abstand das Beste, das ich finden konnte (und ich habe sehr viele ausprobiert). Dennoch habe ich bei IE 6 und v.a. IE 7 das Phänomen, dass der Flow der Bilder einfach stehen bleibt (die Titel laufen weiter). Da das sonst in keinem Browser passiert und auch nur auf einigen Seiten passiert (auf anderen mit offensichtlich identischem Aufbau nicht) fällt mir das Debuggen sehr schwer. Wenn Du kannst schau doch bitte mal hier drauf: http://tinyurl.com/4el9e2 Vielleicht kennst Du die Ursache und könntest mich kurz in eine Richtung lenken. Danke und Gruß
oh well linking was never my strength :-) i guess you can repair those links. Actually that is not bad, as they are temp links only google wont index them :-9
Ah here: I guess there is no good navigation to other user galleries. here are some sample links: www.tempus-vivit.net/fotoalbum /Esca/134060?flow=on www.tempus-vivit.net/fotoalbum /Timm/Weitere_Bilder?flow=on www.tempus-vivit.net/fotoalbum /steffi/Weitere_Bilder?flow=on you can use the navigation on the left side as well, but you have to re-add the ?flow=on
@Finn, don't take it personally :-) I just find non object oriented code always hacky because you never know which variable scope you are in. (okay you are always global :-)) I can provide demo link soon. Its basically in beta testing on our site, registered users have to enable it. Guests always see an old carousel based gallery. But I guess I can come up with a link that switches this.
Super Mario in 14kB JavaScript anyone? http://tinyurl.com/3ugnk4
@ Fabian: HEY, what do you mean by "code wise a bit hacky" ;D Nice one, but can you provide a demo gallery for your version somewhere? That would be just perfect.
@ heinetz: Jepp, das ist dem InternetExplorer zuzuschreiben. Der unterstützt Transparenz nur mit nem komischen Hack... Guck mal da: http://tinyurl.com/5p3vu2
Hi Finn, Hi all just finished my first revised version of your great script: http://blog.hma-info.de/2008/0 4/16/imageflow-revised/ Its using Prototype :-) I do not mind if you don't publish it here. I managed to clean out quite some code that was redundant, perhaps you want to have a look and take some of my improvements back?
Oh, thank you very much :D Thanks for the great script again :)
bzgl. FAQ #4: Im Internet Explorer < 7 geht das leider nicht ;(
@ Che: Oups, sorry that was a general posting 'cause I liked the stuff on that site ;D To help you out: ImageFlow scales in relation to the width of the imageflow container. If you want to have it in a certain height you need to set a certain width. See also FAQ #9 http://tinyurl.com/2wph54
ummm, yeah, thanks for supporting noobs with your sarcasm.. That was really helpful. I'm just asking how to define the height of the gallery? i've tried to modify everything in the screen.css , but nothing seems to work out. : thanks.
Inspiration at http://www.whokilledbambi.co.u k/
Hello, Finn. Thank you for your great script. I am very sorry for asking a noobish question. i've figured out how to position the imageflow gallery without a problem, but.. how do i set the height of the gallery? Thank you for your attention.
@ Fabian: alright... If I like your object oriented customization I'll add it to the next official version ;D But If you use the prototype framework I'll not.
I am currently rewriting the ImageFlow to object oriented javascript. Perhaps even to prototype Javascript. I will put it on my blog when its ready. Finn, as long as I give you the credits, this is ok with you, isnt it?
@ Timo: ImageFlow definiert onclick und ondblclick nachdem(!) die Seite geladen wird. Somit wird dein im HTML gesetztes JavaScript überschrieben. Du musst die Funktion enlarge(this) in Zeile 169 und 255 der imageflow.js implementieren. Dann sollte es funktionieren. Gibts eine ImageFlow EnlargeIt Demo online?
Hallo Finn, ich scheitere bei der Einbindung von EnlargeIt! - in der Theorie sollte es eigentlich noch einfacher gehen als Highslide, nämlich bei onclick focused oder double click die funktion enlarge(this); für das jeweilige Pic aufrufen. Leider scheitere ich, bestimmt mangels JS Know-How oder weil Imageflow macht irgendwas was ich nicht verstehe. Variablenkonflikte sind ausgeschlossen, da in EnlargeIt! alle mit enl_ beginnen. Könntest du mal nachsehen? EnlargeIt! gibt's nach wie vor hier: http://enlargeit.timos-welt.de , wie's eingebunden wird (sehr einfach) ist dort auch ausführlich beschrieben. Wäre schade drum, da ich's eigentlich für ImageFlow geschrieben hab... Gruß, Timo
... die shoutbox hat mein beispiel gefressen ;(
@finn: nee, sorry, ich war undeutlich ;) ich versuche ImageFlow, so umzubiegen, dass statt onclick auf das bild der inhalt von 'longdesc' als document.location geladen wird, das im onclick definierte ausgeführt wird. sprich: '' ... wird zu: '' ... und ImageFlow funktioniert genauso. sprich:
will, care to share your code where it opens in the iframe?
@ Cillian: Read the FAQ #12 http://tinyurl.com/2wph54
@ heinetz: guck dir an wie ImageFlow onload die ganzen Funktionen aufruft, dann weisst du auch wie es für onclick geht ;D
@cillian Here you are http://194.95.111.244/~countze ro/scripts/_myImageFlowLightbo x2/
I've been wanted to ask the author of imageflow this for sometime. Is there a way of including lightbox into imgeflow so (when you click the image shows up in lightbox.) I was woundering would you be interested in doing that? Personally i think it would look really good. Cillian
hi finn, schönes ding ;) ich versuche, onclick eine js-function aufzurufen. das kriege ich zur zeit noch nicht hin ...
Hello Good Work! I'm Italian, scuse me for my english, If I want put lightbox when I click on the as I do?
Ok I figured it out. If you took the time to look thanks.
I could not figure out how to get the image to link to a new window from an iframe. I just removed the ability to link the picture and made the caption the link. Now I have a problem with png's in IE. I have tried some java solutions and a php solution and they just broke the script. Does anyone have a solution for this? My implementation: http://www.hallsville.org/elem entary/cunningham/moodle/
I am using imageflow inside an iframe. I would like when I click the image for the url to open in a new window. How would that look in the longdesc
hi me again :). Is there anyway click on the horizontal scrollbar to make the carousel move? (Apple style). I tried to look at your avascript but i'm no js expert..
great, thanks, i'll contact you as soon as the job start. vitto
@ hvcitto: It is free, do what ever you want to do with it. A backlink or even a donation are highly appreciated. Currently no licencse at all... or if you need one I'd suggest this: http://tinyurl.com/36u7j5 ;D
hi i'd like to use ImageFlow for a website i 'm gonna do n the next two o three weeks. How does the license work? thanks vitto
@ Foo Bar: Maybe, but the latest official release 2.? and all the other browsers do not misbehave anymore...
In ImageFlow, the Images are still being selected on slider-dragging - at least when using Firefox 3.0 Beta 5.
1960s Braun Products Hold the Secrets to Apple's Future - http://tinyurl.com/2mq5eu
@ Marius: It is 100% compatible with the IE6, but you have use some css positioning tweaks. . o O ( as always! )
Finn: Didn't notice your shoutbox yesterday, so I sent you a longer email at your googlemail account starting this way: I found ImageFlow (and LightFlow!) yesterday and love it. Lightflow has moved on to objects other than photographs, such as mp3 files, flvs, even zips – very nice. What I’d like to do is add embedded objects from the web – such as YouTube videos. Instead of giving IF a list of jpegs, would it be possible to give it a list of embedded objects? Thanks for a great script! Steve.
Hi there. first of all, thanks for the script! It's beautiful! Second... Is it compatible with Internet Explorer 6.0 ? It seems that is not but over 50% of the people still use that browser. I know, It's just stupid of them but you can't fight it, can you? Thanks.
Update concerning yet another Typo3 implementation of ImageFlow 0.9 by Oliver Tempel - Check it out http://tinyurl.com/3mqqvk
@ VX600: ImageFlow is initialized on window.onload! If you use AJAX to load ImageFlow that event already has been fired (for content loaded via AJAX is requested after(!) the default page has been loaded). A demo would be useful for further comments on your problem...
I've tried calling Image flow using ajax to populate a container div (using dynamic drive's ajax tabs scripts), but when Image flow loads it's stuck at "loading images" state. A refresh will make it work properly but my questions is: 1) Can Imageflow be called via Ajax? 2) OR does ImageFlow need to initialize itself during page load? Hope this makes sense, I can post a demo page if necessary.
Oop, nevermind. Was a conflict on my img tag in my css :S
My images and slidebar does not show up at all in IE6 (not tested on any other version of IE). It's like the whole script was never in the code. Seems ok in Firefox. Is there anything that I can check to see why it doesn't appear at all? Great effect though!
http://tinyurl.com/59vn9j Check! ;D
@Timo (cpg): Mit Kategorien hast Du aber wahrlich nicht gespart ;-)
Habe ein Forum für den Beta-Test von EnlargeIt! eingerichtet, würde mich über Tester mindestens genauso sehr freuen wie Finn (ich hoffe er bringt mich nicht gleich unter die Erde wegen der Webung *schmunzel*). Zu finden unter http://enlargeit.timos-welt.de /forum
also bei mir habe ich keine Tabellen eingebaut, sondern ein reines CSS-Layout. Allerdings sind diese Blöcke ineinander verschachtelt, eventuell könnte es daran liegen
@Finn und Rick: In der Tat, der IE mag innerhalb von Tabellen nur mit width-Angabe im umschließenden DIV. Die width-Angabe ist also leider in jedem Fall erforderlich, sofern das Seiten-Layout auf Tabellen basiert.
@Timo: danke, da war ich schon - funktioniert nun in allen wie gewünscht; danke
Yet another Typo3 Extension based on ImageFlow! http://tinyurl.com/6log7m
@finn, vielen Dank, genau das selbe Problem hatte ich auch im IE.... blöd wenn man nur im FF testet... aber jetzt rockt das Baby. vielen Dank
Und sorry für mein konfuses Geschreibe, das sieht ja schrecklich auch - werd mich nächstes Mal bessern. Gruß
hi, danke für die schnelle Hilfe. Das Umschließen mit dem div-Tag und position:relative hatte ausprobiert, hat aber nicht geholfen, außer dass das ganze nun etwas weiter links war. wenn ich aber width dazu mache geht es! da der hauptcontainer meiner seite allerdings dynamisch ist, kann ich da keine feste breite angeben, daher: width=100% ohne will der ie es nicht richtig machen - allerdings konnte ich bisher nur ie7 testen
@ Timo (cpg): Die width Angabe ist nicht erforderlich. Lediglich das position:relative; muss angegeben werden. Das Problem tritt nur mit dem IE auf... Ich habe es schon in die Demos mit der Lightbox2 und HighSlide als standard implementiert... wenn eine neue Version von ImageFlow raus ist, wird es da auch standard ;D
Ups, die Shoutbox verschluckt HTML. Gemeint war: [div style="position:relative;widt h:XXpx"] .... [/div] (eckige Klammern durch spitze ersetzen). Hoffentlich gehen die eckigen durch...
@Rick: zusätzliches DIV um Imageflow herum einbauen: , wobei die width dieselbe ist, die du dem Imageflow-DIV gibst. @Finn: Du solltest das zusätzliche DIV wirklich zum Standard machen; es ist leider immer erforderlich, wenn Imageflow in einer Tabelle positioniert wird.
hi, ich habe wie schon andere ein IE-typisches Problem: Die Bilder werden weit weg von der eigentlichen Anzeigeposition angezeit. Siehe hier: http://www.edeljoker.de/edeljo ker/index.php?a=imageflow&b=ho lidaypark07 seite ist noch im aufbau, hab auch schon andere css-templates probiert, doch in keinem passte es bisher. habe zudem ein php-skript geschrieben, dass von allen bildern in einem ordner thumbs erstellt und die imageflow-links so ausgibt, dass nur die thumbs geladen werden und bei klick dasselbe bild in groß angezeigt wird - interesse? denke dass es auch generell kein großes problem mehr wäre, eine komplette bildergalerie zu bauen, die imageflow zur anzeige einsetzt. wäre schön wenn mir jemand helfen könnte, gruß rick
@Finn: Ist die GNU GPL 3.0 nicht frei genug? Ich finde, sie bietet sich für Javascript-Programme geradezu an, da der Quellcode ja automatisch mitgeliefert wird. Deine jetzige Imageflow-Lizenz ("macht damit was ihr wollt") erlaubt es jedem, Imageflow nett zu verpacken und gegen Geld weiter zu verkaufen. Die GPL stellt sicher, dass EnlargeIt! und Weiterentwicklungen daraus für jedermann kostenfrei und legal benutzbar bleiben. Einmal GPL, immer GPL; ich finde das sehr charmant. Außerdem ist so die integration in andere Open-Source-Projekte lizenztechnisch sehr einfach, da fast alle unter der GPL stehen.
@ Timo: Ich habe eine Buchempfehlung für dich: Ajax. Grundlagen, Frameworks und Praxislösungen - http://tinyurl.com/3mdcvf Das kann ich uneingeschränkt empfehlen.
@ Timo (cpg): Thanks für that! Derzeit nutze ich Imageflow zwar zum Navigieren und nicht als reine Bildergalerie. Aber wenn ich mal eine kleine BG brauche ist Dein EnlargeIt! definitiv erste Wahl. Für größere BGs müßte Imageflow jetzt noch in der Lage sein, anfangs nur die wirklich sichtbaren Bilder zu laden. Dumm nur, daß ich null Ahnung von javascript habe. Ich beiß' mir ja schon an nem Zufallsgenerator fast die Zähne aus...
@ Timo (cpg): Wow, nice! Haven't tested it in all browsers, but looks like HighSlide ;D Do you publish it under the following "license"? http://tinyurl.com/36u7j5 ;D
Highslide replacement goes beta... http://enlargeit.timos-welt.de - I'll publish an "Enlarged" version of imageflow in a few days here. :o)
Hi Ceasar and Finn, I've put the ; behind sizeAlgo. I'll look at the 0.9 going into a variable. But I'll do that after it is more objectized, as there are many more 'properties' that are runtime dependent. I have patched the code again, so that you can define a ImageFlowCallBack function. If an image receives front focus, the callback is called with it's id. The callback can then display information in another div or something. I patched index.html also to give an example. The code is available in ttp://www.recursive.nl/oss/im ageflow/imageflow-0_9_3.tgz
Hai PH, Nice example :) The position in IE7 is incorrect. Firefox works correctly
He Stephan, I think that's nice too add to the package. However Math.pow(Math.abs(x), 0.9); 0.9 depends on how big the image is in front so I think this should be variable to0. You forgot the ; after var sizeAlgo = 1
Hi Finn and PH, I've put the resizing formula from PH in imageflow.js. It is selectable by changing the global var sizeAlgo. So you can choose between the original and PH's algorithm. The patch and imageflow.js are available in http://www.recursive.nl/oss/im ageflow/imageflow-0_9_2.tgz Kind regards, Stephan
Hi Finn, I've patched my cookie modification (I forgot to use parseInt and got strange xpos and index numbers). It's available on http://www.recursive.nl/oss/im ageflow/imageflow-0_9_1.tgz Kind regards, Stephan
@finn : Thanks ! Good idea I'll do that ! And I'm going to try to add this effect : http://iaian7.com/webcode/Medi abox which is basically highslide applied to videos ;)
@ PH: Nice! I like it, that you use ImageFlow as a menu for the videocontent. One suggestion: You can add a margin-top and margin-bottom to the loadingbar div in the screen.css to reserve the exact space while the loading like the loaded ImageFlow... Do you know what I mean? That'll avoid your right menu to bounce downwards after ImageFlow has been loaded ;D
yup, it's still work in progress : www.Comitedelaclaque.com/WP (it's in french)
@ PH: Nice! I would lie if I'd say that I understand the math behind your post ;D Do you have a online example somewhere?
I've got it ! replace ligns 197 & 198 by : var sgn_x = (x > 0) ? 1 : -1; var z = 150 + Math.pow(Math.abs(x), 0.9); var xs = sgn_x * Math.pow(Math.abs(x), 0.8) + size;
@ PH: Try it ;D
That would be interesting to try ! The fixed width and height are something I need to add in the Main Loop, right ?
@ PH: Nope. But you can try manipulation the "size" variable and then add a fixed value to the width and height only for the centered image...
Hello Finn, first of all congratulations and thank you for thi wonderfull code. I have currently put in the sidebar of my website and I'm trying to work around a few things. As I don't know any javascript, it can take some time ! ^_^' I would like to make the images that are not focused way smaller than the focused one (like on the Apple dock were a tiny 48x48 icon becomes a big 128x128 one). I've looked for the variable all over the imageflow.js file, with no luck ! Is there a way to do thi effect ? Many thanks, Paul
Working on replacement for Highslide. Should be ready in a few days. Demo link: http://cpgdev.timos-welt.de/en large ;-)
@ Jeff: Read the installation guide - http://tinyurl.com/3y567l (especially Step 1)
Hi, I wonder if you can help ... I've just had a look at this script of yours and it looks kewl ! I've downloaded it and unpacked but when I try to view the index.html file I get the page displaying but with no images ... http://i46.photobucket.com/alb ums/f114/maxicomm/error%20repo rts/ie7.jpg and http://i46.photobucket.com/alb ums/f114/maxicomm/error%20repo rts/ff.jpg ... the first is in IE7 and the second is in FireFox Am I missing something elemental here or is my PC/software in deed of some TLC ??? THanks
Ich bekomme es einfach nicht hin den IE zum laufen zu bekommen. Ich hab schon ein Div mit position: relative um ImageFlow gemacht. So sieht es schon viel besser aus. Aber die Bilder werden immernoch ca. 70 pixel zu weit unten angezeigt. Kann man das mit CSS lösen oder muss ich dazu in die JS Datei? Kann leider nur über Browsershots debuggen.
Thanks for that Finn, everything works well now :)
@ J.L.: Simple questions are fast to answer ;D Strip line 169 and 255 from the imageflow.js.
@ Stephan Leemburg: Sure, many people have contributed to ImageFlow since I released the very first version. It is kind of OpenSource with all the benefits ;D I agree with you, that ImageFlow has to be encapsulated in an own function not only to avoid problems with other JavaScripts but to enable the user to implement multiple instances on one site. Your help is welcome ;D
Sorry if this is a simple question, but is there any way to disable ImageFlow trying to open a page when you click on a focussed image? I'm not that great with JavaScript and this has been frustrating me so much! Cheers
Hi Finn, You're welcome. There are some issues with the cookie and flowTo() patch. It seems not all globals are correctly set. I'll look into this and notify you when it's fixed. One idea I have is to make ImageFlow object oriented and to have multiple display functions. Not only the Math.sqrt(10000 + x * x) + 100; but some more. May I help you with making it more object oriented? Kind regards, Stephan
@ Stephan Leemburg: Thank you! I will have a look at it. But before I release a new version I kind of collect some new ideas ;D
nicht öffentlcih weil ich am projekt bastel! wenn du mir deine email sagen würdest könnte cih dich kontaktieren
Hi Julian, wie wär's mit nem Link zu deiner Umsetzung? Gruß Timo
Hi Finn, I have modified imageflow 0.9 in two ways. 1) if the calling page has a function ImageFlowLoadUrl(url) defined, it uses that function for loading the url instead of just doing document.location = url. If no such function is defined, the behaviour is like it was in 0.9. 2) if my cookie functions are available, on clicking on the focused image, a cookie with it's position is stored for an hour. When reloading the page or when clicking in the backbutton on the loaded url, the imageflow glides to the image on which the user clicked. The imageflow.js, cookie.js and the patchfile imageflow.patch are available on: http://www.recursive.nl/oss/im ageflow/imageflow-0_9_1.tgz Maybe you can incorporate these backwardscompatible patches in imageflow. Thanks for Imageflow and kind regards, Stephan Leemburg
IE Problem! Hi, ich habe das ganze rechts mittig auf meiner seite in klein verbaut ( 180px breit ) im Firefox ist es perfekt im ie sind dei bilder aber ganz oben links und der scroller an der richtigen stelle kann mir da jemadn helfen? is ie7
Guys, Thank you. I hope I can figure out how to use this without too many questions... however, I already have one which is how to customize the image that gets displayed using Highslide, for example if I want to add the Next and Prev buttons, are there attributes that I would add to the img line: Or do I do it somewhere else? I notice in the tip text that it says you can use the arrow keys for the next and previous images but this just closes the image. Anyway, this is a good start and I really appreciate your help with this. Thanks.
And there is a newsentry on this one: http://tinyurl.com/3anglm - I mentioned, that Highslide is licensed under a Creative Commons Attribution-NonCommercial 2.5 License. This means you need the author's permission to use Highslide JS on commercial websites!
Okay, here we go: Thanks to Ceasar Feijen there now is a Highslide JS compatible version of ImageFlow available under: http://tinyurl.com/2y4vpw
@ Ceasar: I got it, still implementing it... will be available in ca. half an hour.
Just sended the example package to finn so he should have it by now
Awesome, Thanks Ceasar.
I will download the example image flow from here and will prepare a new example with highslide. I will sent it to Finn
Caesar, I don't suppose you have a simpler example? I have the images displaying on my site in ImageFlow but I can't get them hooked up to Highslide. When I click on the image from ImageFlow it displays the image on a new page without any of the windows decorations. If I follow the example code then I can get it to behave correctly in the same page (http://vikjavev.no/highslide/ example-slideshow-controlbar.h tml), I do this from the same page as the ImageFlow so I know the basics of the page are in place. I'm still pretty new with html/css/js so it could be that I'm missing some fundamental steps. Thanks, Saracen
Regarding Highslide: It's great, but it's not free software (like Imageflow is). It's only free for non-commercial use. I'm taking care of the Coppermine Highslide plugin as well - in the end, it's nothing but trouble because you can't bundle it as you wish without caring for two different licences, trying to make the users understand that one part of the software is free and the other isn't. I respect the decision of the author very much, but I'd recommend to look for a replacement to keep Imageflow completely free and bundle the implementation to keep it more usable. Just my 2 cents.
@ Ceasar: Smooth usability! Thank you very much! Will have a look at your source...
I'm having troubles installing Imageflow with a basic image rollover javascript from: http://www.dnolan.com/code/js/ rollover/. Any ideas on how to fix it would be greatly appreciated.
Isnt highslide twice as big as lightbox? 32 k packed worries me a bit. I got it working, not sure if i want completly replace lightbox by highslide
mit transparenten icons ist alles soo langsam. bei 30 usern online dauert es sehr lange (1-2 sekunden) bis die gespiegelten bilder erstellt sind. Kann man sowas nicht mit thunbshots amcehn wie in der normalen?
OK, I'll take a look when I get a chance, it may be a few days. Will I be able to support slideshow as demonstrated in the highslide examples. Thanks.
Just download highslide from here http://vikjavev.no/highslide/ Look in the source on my site how I did everything
Finn/Caesar: Once again thank you for the tips. I like what I see on Caesar's site so will take a look at using highslide. You mention grabbing the source code, do you mean from the highslide site or from your site? I didn't see it on your site? Frog, in Firefox I do not see the images when I click on them from ImageFlow, I just see a white box in the background (I know it's still in development!). Randy Tamayo's site is amazing for many reasons :-) Thanks once again folks.
Strange, but I think I have types the name wrong, that message fromo "Caesar" at 20:31" is my message.
I haven't tested my site completly in all browsers, because it is brand new, but I will fix it in a while. But the bug is a bug in MultiBox, so it doens't occurs with Lightbox, so if you want to implementate it with another Lightbox clone you just need to change the code a bit, but not much...
Frog : Your popup isn't completely bugfree The image on the popup is too much to the right and not in the center Tested with IE7
Another time i give the wrong link! Here is the right one: http://www.aizokroon.nl/portfo lio.html
With my MultiBox and ImageFlow integration you can integrate almost every Lightbox clone, because it uses links. There is only one thing that isn't handy of using links, that is that if you click on a image it always opens, even if it is not the center image, but the next and previous buttons works and i think you can make that way what you want. Here is my site with integration: http://www.aizokroon.nl
Just check the site again :) I removed the close click
That can be done I hacked highslide so that when you click anywhere the picture will be closed. Just remove this from my config highslide hs.addEventListener(document, 'click', function(e) { // normalize if (!e) e = window.event; if (e.button > 1) return true; if (!e.target) e.target = e.srcElement; // check if it is part of an expander if (!hs.getExpander(e.target)) { // close the currently focused expander hs.close(); } });
@ Ceasar: Nice, but I want it to leave the images ontop... to drag 'n drop, comparing images etc... Like I implemented it on http://www.arnerautenberg.de/P erson/Bibliographie for the bookcovers
Here an imageflow with highslide example http://www.cfcms.nl/voorbeelde n-van-cfcms-systemen.html Just grab the sourcode and you are done
Master Plan - About the power of Google - http://masterplanthemovie.com/
@ Saracen: Okay, I got that, but what do you need ImageFlow for then? I just did the Lightbox2 Hack as a Proof of Concept. It is not my favourite effect anymore, now I'd prefer HighSlide http://vikjavev.no/highslide/ . o O ( Will make an implementation sometime). You have several usability problems with the lightbox. The main Problem is, that it is big (filsize) and slow (resizing effect, blurring the background etc.) Another Problem I have with it, is that it breaks the link chain (OK ImageFlow does that too ;D). But if you click on an image in ImageFlow you have a unique link, that could contain all the information you want. If you use the Lightbox2 - as it was inteded - there is no link you can copy 'n paste, that leads to the popped open lightbox containing the caption. What I'm trying to say is, that the best practice usage of ImageFlow would be something like that: http://tinyurl.com/286heg or a combination of ImageFlow and HighSlide...
Finn/Fabian: Thanks for the responses. I'm not really familiar with Java or html so I tend to fumble my way around the code. Fabian managed to nail what I'm looking for with the Next and Prev buttons on the LightBox image. I understand the methods that can be used to drive imageFlow but one of the drawbacks of ImageFlow is the size of the images (I have changed some of the width parameters to change this but I am also up against some real estate issues). I like the fact that I can quickly leaf through images and look at an image in much greater detail, the next natural progression is to allow the higher resolution images to be viewed without going back to ImageFlow. I see this a little bit like a microfiche. Help is much appreciated on how I can achieve this. Thanks once again guys.
@ John: Read the FAQ #4 http://tinyurl.com/2wph54 to handle transparency
hey i cant use transparent pictures wehen i include them the background will be black is that fixable?
@Saracen The main issue is that Lightbox and ImageFlow adress the pictures differently. Lightbox requires that rel="lightbox" link around the image, while the existance of that would break imageflow. What I did is that I patched the click handling to invoke lightbox. but as you say, no "next" and "prev" as lightbox is not aware of multiple images (but hey, just got an idea how to patch this)
well done mate - well done
@ Saracen: What exactly do you want? Next/Prev Buttons for ImageFlow? You are aware, that you can naviagate by A: Using the slider B: Using your Scrollwheel C: Clicking the next/prev Image and finally by D: Using your left and right arrow keys...
Anyone? Finn, Thanks for all your work on this, the technology is very cool. I read below a request to have the Next/Prev buttons on the Lightbox image. I for one would like to utilize this as once I'm viewing the images I don't want to keep going back and forth between the Lightbox image and the coverflow images. Is it possible to enable this in the java code?
Ja hab ich aber ich versteh nix von javascript ^^ könntest mir nen codesnippet posten wie des ding 180px breit wird und das die bilder nicht so groß gezogen werden? und wie man damit verlink wäre echt supernett
@ Julian: Wir brauchen alle Antworten! ;D Lies dir die Installationsanweisung durch ( http://tinyurl.com/2xrs55 ). Für alles andere poste mal ein link zu deiner Implementierung...
Ich brauch echt antworten auf die frage hab erst zu spät gesehen das du deutsch bist 21:51 - ju hey wie mache ich das die bilder als link verwenden kann? gruß Ju 21:49 - Julian Hey i give the #scrollbar the fixed width atribut but its not working. and if i put in pictures wich habe 50x height and width its makin them big and looking bad ( sind verpixelt )
14:54 - Ceasar - js error in IE7 and IE6
Solved the error can't find member in IE if(navigator.userAgent.search( /msie/i)!= -1) { // nothing !! } else { /* Fixes the back button issue */ window.onunload = function() { document = null; } } PS. it would be nice if this shoutbox knows when I hit the next line :)
@ Timo: LOL, PHPBB hat gerade den 1sten April: http://www.phpbb.de/trojaner.h tml
phpbb 2 oder 3. Benötigt PHP und eine SQL Datenbank (MySQL). Es gibt Unmengen Themes. Versuchsweise könnte man einen Guest-Account zur Verfügung stellen, so daß man auch ohne Registrierung schreiben kann. Ich würde rein englisch-sprachigen Support empfehlen (bis auf Ausnahmen). Die Linkerei zwischen Shoutbox und FAQ (noch dazu zweisprachig) ist ja nicht so dolle. Gleichzeitig könnte man MODs besser im Auge behalten und Wege finden, diese in den "normalen" Release einzubinden (wer soll da sonst den Überblick behalten?).
@ Timo wg. Forum: Und wer soll so ein Forum warten? Ich finde es eigentlich ganz gut, dass es über die Shoutbox läuft, weil die Probleme nun nicht wirklich so gravierend sind. An was für ein Forum hättest du denn so gedacht? Poste mal ein Link....
Nö, das ist doch ganz simpel. Lad dir die aktuelle Version des CPG-Plugins. Die reflect.php ist so umgestrickt, dass du ihr einen zusätzlichen Paramter (in der Form &fixed=900) mitgibst, der der Pixel-Width des Imageflow-DIVs entspricht wie du sie im CSS festgelegt hast. Wenn die Variablen im Javascript so gesetzt sind wie beschrieben, entsprechen die Pics, die das reflect.php liefert, dann exakt der benötigten Größe, und keine Skalierung ist mehr notwendig.
It is perfect now : ) Only in MSIE 8.0 it doesn't look good. I checked it with http://browsershots.org , and every other browser displays it well. screen in MSIE 8: http://img245.imageshack.us/im g245/5467/8b3148c634f73c0c2986 ab4mw8.png
@Timo (cpg): Das ist jetzt ein Aprilscherz!? Wie soll man denn das Umsetzen? Da spielen also auch die Variablen in der imageflow.js mit rein? @Finn: Wird's doch Zeit für ein Forum? Ich stehe zur Support-Verfügung (auch wenn zugegeben wenig bis keine Ahnung habe). Zum Zusammentragen einer Foren-FAQ und Verfassen von englischsprachigen Tutorials dürfte es jedoch genügen!
@ Jan: The image positioning breaks in the IE. Try to encapsulate the imageflow container. Read this: http://tinyurl.com/yvlozw - Yeah, support is growing. I like the support/feedback and optimization hints from all of you out there... thanks! ;D
Hey, here I am again :') The script works perfect, but I can't adjust the css as I want to. This is the site: http://www.aczele.be/atleten2. php I want less white space above and under the pictures. They are also not centered (including the image captions). I tried with margin, padding, ... but it doesn't seems to work... Sorry for my problems :') tnx in advance. btw, great support for this script!
huch es muss natürlich conf_focus heißen, nicht cpgif_conf_focus (ich hatte für das Coppermine Plugin sämtliche Variablen- und Funktionennamen mit dem Vorsatz cpgif_ versehen, damit sich das JS besser mit anderen verträgt)
@Timo (der andere) - Für conf_reflection_p = 0.4, cpgif_conf_focus = 3, image.pc (Querformat) = 118 und image.pc (Hochformat) = 90 berechnet sich die Weite eines Bildes wie folgt: a) Bilder quadratisch oder Querformat - breite[px]=gesamtbreite des imgflowdivs[px]*0.295 b) Bilder im Hochformat bis Verhältnis 2:3 - breite[px]=gesamtbreite des imageflowdivs[px]*0.225 c) Bilder mit noch heftigerem Hochformat - breite[px]=gesamtbreite des imageflowdivs[px]*0.22. Da ich die eingangs genannten Variablen nicht ändere, decken diese drei Formeln alle Möglichkeiten pixelgenau ab. Der Gewinn an Bildqualität ist je nach Browser atemberaubend bis bemerkbar. Gruß, Timo
@Timo (cbg): Wie sieht Deine Lösung aus?
hi Finn erstmal danke für dein grossartiges tool (imageflow)! ich habe nur zwei probleme: 1. die Bilder sind irgendwo rechts im Browserfenster obwaóhl ich schon lales probiert habe um sie auszurichten,erfolglos. 2. Die Bilder sind bei einer normalen Bildschirmbreite (1024px x 768) total klein, obwohl sie sehr gross eingestellt wurden. habe leider dazu nichts in den FAQ gefunden.
21:57 - Ceasar - js error in IE7 and IE6
Hai finn, When you set javascript error report on in IE you will see the following message error:can't find member The error is document = null; /* Fixes the back button issue */ window.onunload = function() { document = null; } Can I savely remove this entry ?
hey wie mache ich das die bilder als link verwenden kann? gruß Ju
Hey i give the #scrollbar the fixed width atribut but its not working. and if i put in pictures wich habe 50x height and width its makin them big and looking bad
Finn, Thanks for all your work on this, the technology is very cool. I read below a request to have the Next/Prev buttons on the Lightbox image. I for one would like to utilize this as once I'm viewing the images I don't want to keep going back and forth between the Lightbox image and the coverflow images. Is it possible to enable this in the java code?
20:54 - Timo (der mit dem cpg-plugin)
Hallo Finn, hab die Mathematik gefunden, damit die Bilder 100%ig skalieren, sieht einfach klasse aus jetzt. Dabei ist mir eine Sache im Javascript aufgefallen, die du vielleicht mit der nächsten Version verbessern könntest: Fotografien liegen im allgemeinen in Formaten Breite:Höhe zwischen 2:3 und 3:2 vor (2:3 und 3:2 - Spiegelreflexkameras, 3:4 und 4:3 Consumer-Kameras). Damit die Pics nicht überstehen, solltest du in Funktion refresh(onload) für /* Portrait and square format */ die den Wert image.pc = 90; setzen. Dann funzen alle gängigen Bildformate korrekt, d. h. auch Bilder im Format 2:3 passen gerade noch so in den Container und stehen nicht über, und Bilder in 3:4 haben oben noch einen ganz schmalen Rand, so wie man's gern hat. Vielen Dank nochmals für's tolle Script! Gruß, Timo
@ Julian: Set a fixed width for it in the screen.css...
Hi! Great thing! but how can i change the lenght of the slidebar? i just want it 100px long thanks for your help
@ Ceasar: No problem ;D You are right I should kind of isolate all imageflow stuff in a function to avoid problems with the event window.onload... A thing for the next version!
Sorry Finn for my dutch language :) For all with js problems. Most problems will occur when you have severall window.onload functions. Try to put them into one function instead Example function start(){ startimageflow() } window.onload = start;
Thanks, it works now. It was indeed the general.js that screwed the script :)
Zie niet zo een fout maar het zou de body onload kunnen zijn. Probeer eerst eens even met alle js bestanden verwijderd op imageflow.js na. In general.js heb je een window onload en imageflow.js ook een /* Hide loading bar, show content and initialize mouse event listening after loading */ window.onload = function() { if(document.getElementById(co nf_imageflow)) { hide(conf_loading); refresh(true); show(conf_images); show(conf_scrollbar); initMouseWheel(); initMouseDrag(); } } Heb het zelf als volgt opgelost /* Hide loading bar, show content and initialize mouse event listening after loading */ function startimageflow() { if(document.getElementById(co nf_imageflow)) { hide(conf_loading); refresh(true); show(conf_images); show(conf_scrollbar); initMouseWheel(); initMouseDrag(); /* 5 is 5de plaatje -x is 5 x 150 */ glideTo( -750, 5); } } En daarna in mijn function.js function start() { externalLinks(); //highlightLink(); startList(); startimageflow() if(document.getElementById(' menu_treeview') != undefined){ initTreeview(); } } window.onload = start;
@ Jan: Try to include the imageflow.js as the last JavaScript in the header. And if it still does not work ImageFlow probably has a problem with prototype...
Very nice script!! I tried to install it on my website, but it doesn"t work -_- Can someone help me? Site: http://www.aczele.be/atleten2. php
Brilliant creation. Thigs that were earlier thought of could done using flex / actionscript...now peoples like u have proved that a minor development tool like javascript can achieve similar height. Bravo.
I am trying to pack the script but when I do that there are severall errors http://joliclic.free.fr/php/ja vascript-packer/en/index.php Mostly this is because some functions in js are not closed with ;
Hmmmm... Need a coffeebot http://ffffound.com/image/6459 99566e0df26770d988ea24c4e61b1b e36348
Nice, someone added a link to ImageFlow in the english Wikipedia article about Cover Flow: http://en.wikipedia.org/wiki/C over_Flow
Beware of the NEWTON VIRUS ;D http://www.troika.uk.com/virus .htm
PaDee: Schreib in die screen.css zu der #imageflow definition ein width:500px; dazu... Ersetzte 500 durch eine Breite deiner Wahl.
@Dreisatz: genau das Problem hatte ich auch, das ist wohl nicht so trivial. Zumal mir Firebug auch anzeigt daß die Pixelmaße nie exact sind. Interessant ist aber der Ansatz das via reflect zu kompensieren. Zumal bei großen bildern die reflektion manchmal zu lang ist. Ich bastele da auch mal dran rum
@caesar its not live yxet. its in development version of our page, I can link i once its live. @Dreisatz
19:45 - Timo (der mit dem cpg-plugin)
@finn: Das mit dem Dreisatz ist nicht so einfach, da dein Script die Bilder je nach Format völlig unterschiedlich skaliert. Die Frage ist: Wie genau skaliert es die bilder? Als Beispiel: Bei 900 pixel Breite der gesamten Animation hat ein Bild, das im Fokus steht, exakt 265 Pixel Breite, sofern es im Format 3:2 vorliegt. Liegt es im Format 4:3 vor, dann zeigt das Javascript die Datei deutlich breiter an. Mir ist die Mathematik dahinter nicht klar, daher die Frage. Kannst du mir auf die Sprünge helfen?
würde gerne wissen wo genau in der css datei ich angeben muss wie groß die bilder maximal skalieren dürfen,..denn bei mir nimmt es fast meinen ganzes browserfenster ein,..brauch dringend rat da ich ne super idee hab und unbedingt deinen coverflow benutzen möchte
@ Timo 2: ;D Das kann man auch einfacher haben. Man gibt in der PHP Datei als Variable die fixe Breite des ImageFlow Containers an und liest die Bildproportionen via PHP aus. Dann berechnet man daraus die optimalen Abmessungen der Bilder mit der Spiegelung. Dazu muss man nur ein bisschen PHP können ;D
@Finn & Timo (hallo Namensvetter): Genau das wäre ein echter Fortschritt. Je nach Browser sticht die Umrechnung leider deutlich ins Auge. Alternative wäre ein Zusatztool, daß die Einstellungen in imageflow.js und screen.css ausließt und daraus die maximal mögliche Höhe für die Bilder errechnet. Dann kann jeder entscheiden, ob er erst gar keine größeren Bilder hochlädt oder ob er das src-Attribut entsprechend anpasst (wird eigentlich die Breite proportional verändert, wenn man die Höhe vorgibt?). Ich schätze man kann das nicht in die imageflow.js einbauen, da ja die reflect.php "vor" der imageflow.js ihre Arbeit erledigt...
@ Timo: Wie wärs mit dem guten alten Dreisatz?! ;D http://de.wikipedia.org/wiki/D reisatz
Hi Finn, da ich das Resizing der Ursprungsbilder via reflect.php verbessern will: Gibt es eine mathematische Formel, um die exakte nötige Größe zu ermitteln, so dass nicht interpoliert werden muss? Nimm als Beispiel meine Testgalerie http://cpgdev.timos-welt.de/cp g1416/ - Ich weiß, dass das DIV, welches Imageflow enthält, exakt 900px breit ist (weil ich's in der plugin config so einstellen kann). Ich weiß, dass rechts und links jeweils 3 verkleinerte Versionen vorhanden sind. Ich kenne das Format der einzelnen Bilder (3:4, 2:3, 4:3 etc.). Gibt es einen Weg, um anhand der o. g. Daten die exakte maximale Darstellungsgröße zu ermitteln? Die Interpolation sieht ja nach Browser sehr unterschiedlich gut aus (Safari: Perfekt, Mozilla: Naja...), so dass ein großer Fortschritt wäre, wenn wenigstens das zentral positionierte Bild in der Darstellung exakt seinen Pixelmaßen entspricht. Liebe Grüße, Timo
Hai Fabian, Could you show the results ?
Last but not least: I have done it. Great script. It would now be greater to rewrite it to prototype :-) The height comes off the width. adjustung the width to 100 does the trick
Thanks ceasar! Thats working, I also made my thumbnail generator generate mirrored thumbnails, works also cool now. the only thing I just want to do is make the pictures not so small. They are significantly smaller than the input image. is there a control for that?
Okay, the one in the wordpressplugin works for me. Thats great. However I am using unreflected images (as they come from DB, read via URL) and the pictures scale incorrectly. Any advice how to debug the incorrectly scaled images? They are: 168x260 200x232 149x260 you can try how they will look in the flow without reflection (and that factor set to 0)
I had that to It's really quite simple :) Put a div around then it will much easyier to handle example #pluginflow { max-width: 600px; min-height:310px; text-align: left; margin: 0 auto; position: relative; background-color:#fff; padding: 0px 20px; } for a live example (just check the source) http://www.cfcms.nl/voorbeelde n-van-cfcms-systemen.html
He Finn, I have also quite a lot of issues with positioning of images, slider and the main box. It seems many people have. cany you try to make it more robust? Its pretty hard to integrate in existing layout
see-thru laptops! - http://tinyurl.com/2c5e4q
Hai Timo, Thanks :) This works perfectly
Hi everyone. I've been working on this one for hours and I just can't seem to make it work. Look at this screen print: http://img152.imageshack.us/my .php?image=71661725sq5.png Do you see the space between the slider and the images? I tried to get rid of it but I can't! It looks like the images' position is absolute (could be?) although it's position in the CSS is set to relative... Anyone ever encountered this problem? Any idea what should I do? Thanks!
Hi ceasar, yes this is possible. Get the cpg plugin (http://tinyurl.com/2j9539) and have a look at reflect.php. The interesting part starts with the line "$inbetweenoutput = $finaloutput;" and ends with "Output our final PNG", shouldn't be too difficult to port it to the original reflect.php. You can then add &procent=0.8 to the reflect call, and the generated image will be 80% in size.
A question about the thumbs. If you look at your example reflectCAM4X7CU.jpg then this is the cached thumb but it is not really resized The actuall resize is in the html This doesn't look real nice. Isn't it possible that the thumbs will be really resized witp GD and not in the html for better result ?
sorry, just tried the shoutbox. would like to integrate that on me page too.
asd
@ Timo: It didn't work. =/ Any other suggestions? Here's my css url, http://www.forevercassie.com/i mageflow/screen.css
@Armir: Try different psition-attributes in your stylesheet. Maybe "relative" for your "interface" id might do the trick...
Are you available for some customizations?
Hi, I'm have a few problems with the image flow. I figured out how to move the image flower but, the pictures are below the scroller. Can someone help me please? Here's the url to my site. http://www.forevercassie.com/i mageflow/
put this line below the last line of the window.onload function to start with the images in the center: glideTo(Math.floor((-150)*(max /2)), Math.floor(max/2)); I´m Brazilian. And I not know speak english very well. I hope that you can understand. Bye!
I too have some problem with IE? www.louisemaagaard.dk Help :)
Hi Finn, Last question (sorry for being a pain!) If you look at this page in IE: http://www.slougheaz.org/scree n_works/ You will see a big gap between the caption and the pictures (but only in IE). Any idea how to fix this in the CSS? tHANKS
I tried that, but in some browsers there is and ?-icon, where there should be the loader icon?
Michael Kremer: Sure, delete the image located there: http://www.louisemaagaard.dk/i mages/loading.gif - Nice "workaround" ;D
I cant get it to work...? Can I somehow remove the cirle-loader? Thanks for your help.
@ Chris: That is hardcoded... but try editing the css like #imageflow{margin-top:-25px;}
@ Michael Kremer: As I said before, make sure, that you use the correct files from the imageflow lightbox hack. You are currently using the id loading for the loading bar of imageflow, but that crashes with the lightbox loading circle which is also called loading. You need to stick to my demo. I renamed the imageflow loading bar to loading_bar. You need to alter the css and your html to make that work. Check http://tinyurl.com/2jpbjn need http://194.95.111.244/~countze ro/scripts/_myImageFlowLightbo x2/screen.css
Hi again, sorry to bother you again, but I almost have it now. The loader inside the photos, when you click them, does not disappear when the photos are loaded? Please Help... And thanks in advance
PS: When I say slider I mean the whole carousel
Hi Finn, Thanks for that. The last thing I want to do is move the slider more up to the top, but can't see in the CSS where to do it? If you could help me that would be great
@ Chris: Use Images without reflections? Look at your imagesrc: http://tinyurl.com/3447b2
Thanks Finn. That's helped but I still have a partial shadow at the bottom: http://www.slougheaz.org/scree n_works/ Also in the CSS how can I make the images appear more to the top of the black div? Many, many thanks Chris
@ Chris: Disable the reflections by deleting 'reflect.php?img=' out of each img tag in the index.html. You also need to set the conf_reflection_p variable in the imageflow.js to 0
Hi, Is there any way I can turn off the reflections in the script? Thanks
@ Michael Kremer: Ah, you are using the lightbox2 version... The image is centered now, but the loading is always on top... Make sure, that you use the css files from the ImageFlow Lightbox2 hack/demo: http://tinyurl.com/2jpbjn
Well as you can see when you click the first photo http://www.louisemaagaard.dk is it not centered? It's looks really bad. Maybe its something to do with my CSS? Hope you can help med. Thanks
@ Kremer: Works fine? or fine! ;D
Hi and thanks for your fast reply... My JaveScript is enabled, and your examble works fine?
@ Michael Kremer: ImageFlow is based on JavaScript you need to enable it in your Browser... Your Implementation just works fine as it is!
Hi I have tried to implenment the Imageflow withbox, but when I click a the photos they are not centered and the loading-gif is there all the time? http://www.louisemaagaard.dk Please help.. Thank you my mail: info@kremer.dk
@ Uwe: Wenn die Cache Funktion der reflect.php aktiviert ist müssen die gecachten Bilder vorher gelöscht werden. Ein paar Beispiele: 20 - http://tinyurl.com/349yrj | 80 - http://tinyurl.com/3aq82e | 127 - http://tinyurl.com/345dfn
@ Uwe: Klar, kann man das reduzieren. Guck mal in die ersten paar Zeilen der reflect.php. Es gibt zwei Möglichkeiten: 1. hinter jede Bild URL, die über die reflect.php aufgerufen wird "&fade_start=50" ranhängen, oder 2. in die reflect.php ganz oben einmal $_GET['fade_start'] = 50;" einfügen. Der Wert der Variable geht von 1 bis 127 und bestimmt die Intensität der Reflektion. 127 ist eine volle Spiegelung und 1 ist nicht mehr sichtbar, Standard ist 80.
@ Finn: ich habe jetzt schon viele positive Feedbacks zu meiner Website mit imageflow http://www.menschenfotografie. de Einige Besucher finden die Stärke der Spiegelung bei manchen Fotos etwas irritierend. Gibt es eine Möglichkeit, diese etwas zu reduzieren oder planst Du eine Option dies einzustellen? Viele Grüße Uwe
@ Zetty: Fang mal an... wenn du auf Probleme stößt helfe ich gerne weiter...
Sehr tolles skript - vielen Dank dafür! Ich würde gerne Highslide (http://vikjavev.no/highslide/ ) statt der Lightbox als ImagePopup nutzen, habe aber noch keine Ahnung, wie ich das integrieren soll. Wenn die Lightbox geht, sollte Highslide eigentlich auch problemlos funktionieren, oder? Bin für jeden Tipp dankbar!
@ jib: Fine... not bad for "blindcoding" it ;D But a general usability warning: You should avoid opening content in new windows. Nice reading on that one http://tinyurl.com/25dnkx (german) http://tinyurl.com/2yg7ra (babelfished to english)
yes it work perfectly
@ jib: Did it work? 'cause I did not test it ;D
thanks a lot!
@ jib: Try the following: Replace document.location = this.url; in the imageflow.js by window.open(this.url, '_blank') ;
Brainiac - A slap in the face: http://tinyurl.com/34yyyh
Hello, fisrt of all: you did a great script! i would like to create a NEW window with the original siez image when a user click or double click on an image. i have tried, but can't find how to do that... thanks for your help
That link you sent me spaces the two images around the center image out, but not the rest of the images. There is still overlapping on the outer images for some reason.
Hooray - Plugins anyone? Wordpress (Thanks to Mark N): http://tinyurl.com/2rtl5r and Coppermine Photo Gallery (Thanks to Timo): http://tinyurl.com/2j9539
@ William: Do that: http://tinyurl.com/2rpwqv
Hey Finn, Looking to get the starting position of all images side by side instead of overlapping. Is there any way to achieve this?
eu sou de mas
Hey Finn! Wordpress plugin now working! CSS fixed for all browsers the plugin is at http://www.spondonoffroad.co.u k/wordpress-plugins/imageflow- gallery-wordpress-plugin/ Example gallery http://www.spondonoffroad.co.u k/club-matters/gallery-test/ Thanks!
Hallo Finn, habe um dein unglaubliches Script herum ein PlugIn für die Coppermine Photo Gallery gebaut. Näheres unter dem Link: http://forum.coppermine-galler y.net/index.php/topic,51386.0. html Viele Grüße Timo
@ Mohammed Mudassir Azeemi: There is currently no JavaScript solution for the reflection that works with ImageFlow. You can try to implement it yourself. I once tried to combine the reflection.js ( http://tinyurl.com/lkgkp ) with ImageFlow, but failed ;D You need to digg deep into that code to understand and rewrite it... Generally you can do such a thing, but you should ask yourself if it is worth the effort and there probably will be a performance dropp..
23:43 - Mohammed Mudassir Azeemi
Hi! Very superb stuff you did! I have a query, is it possible that I can use this without using the .php ? I am using the ASP.NET 2.0 rightnow, and want the solution 100% in JavaScript , instead of having PHP with it. If you can help me for it, i will appreciate it. My email is : mmudassir@gmail.com
That Rocks. Nice smooth motion
Gruß Peter
Also zum einen hab ich es jetzt auch mit top.window.location geschafft anstatt von parent[Framename].location - ich werds mal nochmal versuchen. mit einem DIV. hab zwar letztens schon stunden gebastelt, aber ständig hatte ichnen anderen fehler. jetzt jedenfalls funktionierts. trotzdem danke für deine mühen.
@ Peter: Du benötigst doch kein IFrame, um ImageFlow in einer fixen Größe einzubinden... Da kannst du auch einfach in der screen.css für das #imageflow div ein width:500px; einfügen.
oh html tags gehen hier nicht :-) [frame name="mainframe"] fehlte
in der index.html hab ich reingesetzt
Hallo Finn, das Problem ist, ich möchte das ImageFlow in einer festen Größe auf die Seite einbinden. Daher der IFrame. Ich habe in der index.html jetzt dort ist dann auch der iframe drinnen. und dann natürlich in der imageflow.js parent[mainframe].location. aber ich krieg ständig den fehler mainframe ist nicht definiert. irgendwie hab ich glaub ich nen totalen denkfehler.
Hey Finn, Thanks, thats put it into a much better position. Still disagreement between IE and firefox about where it should be in the post though. IE is overlapping my comments entry textbox at the moment. Thanks, closer to a release!
@ Mark N: Nice! Try encapsulating the imageflow div with another div that is positioned relative. The IE tried to position ImageFlow relative to the whole document. Should look like style="position:relative;
Hi, Well done for a superb gallery. I have written a wordpress plugin for it which is at http://www.spondonoffroad.co.u k/wordpress-plugins/imageflow- gallery-wordpress-plugin/ There is always a problem though, I cannot get my plugin to play nice with IE7. I am sure it is a css issue, but cannot work it out. Try looking at http://www.spondonoffroad.co.u k/club-matters/gallery-test/ in firefox and IE7 Any Help welcome, Thansk
@ cy-one: Klar geht es auch mit weißem Hintergrund. Dazu musst du die #imageflow und #slider Farbe in der screen.css ändern, das slider.png und die Reflektion: FAQ # 5 http://tinyurl.com/3d2p8q
@ Peter: Du musst natürlich "Framename" durch die Bezeichnung deines Frames ersetzen in welchem die url geöffnet werden soll! Aber am einfachsten - und benutzerfreundlichsten - ist es das ganze mal ohne frames zu versuchen...
Hi Finn, ich hab Dein Script in einen iframe eingebunden und habe jetzt das gleiche Problem wie johnny, dass ich mit den Links aus dem iframe nicht mehr rauskomme. Entweder überseh ich was, oder ich bin einach zu doof dazu. Wenn ich parent[Framename].location = this.url; verwende, krieg ich nen JS Fehler Framename ist nicht definiert. nehm ich parent.frames[0].location = this.url dann öffnet er die links immer noch im iframe. Vielleicht hast du ne kleine hilfestellung für mich.
PPS: Wäre schön, wenn man Zeilenumbrüche in der Shoutbox machen könnte *g*
Ans praktische bin ich bisher noch nicht gekommen, ImageFlow hat keine so hohe Priorität (was ich nicht bös mein, aber erstmal muss die Seite an sich stehen *g*) Ich verwende das Framework Mootools und hätte wohl da dann was mit verbunden. Mootools hat auch son Bild-Popup-Gedöns... Aber dauert nochn bisschen. Und ich will mich Cody anschließen, wirklich sehr, sehr, sehr tolles Script hast du da. PS: Geht das auch mit weißen Seitenhintergründen?
Finn, you rock, thanks soo much for your help.
@Finn: Vielen Dank Finn! So funktioniert es bestens :)
@ Jones: Make them smaller? ;D
@ Kay: Well all you need to do is making the img definition in the css only for the imageflow div container. That is what the autor of your other JavaScript meant. Replace img{[...]} in the screen.css with #imageflow img {[...]}
Any body know how to get te images to load faster?
@Finn: Es scheint, das Imageflow (screen.css) Bilder absolut positioniert, was ein Problem fuer andere Javascript libs hervorrufen kann. Der Autor der lib meint, Imageflow sollte seine Styles besser kapseln, so dass es besser kompatibel wird. Hier ist die Originaldiskussion: http://tinyurl.com/27nptp Finn, was meinst Du dazu? Wie kann man das Problem am besten loesen?
Sorry, das habe ich voll vergessen, zu sagen. Ich schau mal, ob ich da 'ne Lösung finde.
@ Johnny: Sag doch, dass du ImageFlow mit der Lightbox2 benutzt... Da musst du dann auch noch im Lightbox Quellcode rumpfuschen... Aber frag mich bitte nicht wo ;D. Ist es bei deiner Webseite unbedingt notwendig ImageFlow als iframe einzubinden?
Nee, das funktioniert leider nicht. Lightbox öffnet die Bilder auch weiterhin auf der eingebundenen Seite.
@ Johnny: Oups, jetzt habe ich deine Frage erst richtig verstanden. Lies dir mal das durch: http://tinyurl.com/q6emn und dann versuch mal ob es funktioniert, wenn du in der imageflow.js "document.location = this.url;" durch "parent.frames[0].location = this.url;" ersetzt.
@ Johnny: Das habe ich direkt im Post unter deinem versucht zu erklären. Aber da habe ich noch kein Feedback bekommen, ob das so klappt. . o O (Keine Zeit zum selber testen) Probiers mal aus ;D
Wenn ich Imageflow via iFrame einbinde (die Site hat ansonsten keine Frames), wie kann ich es dann erreichen, dass die Bilder nicht im iFrame, sondern auf der eigentlichen Seite (die, die ImageFlow via iFrame einbindet) anzeigen lassen?
@ Oliver und serienking: Versucht mal folgendes, ohne Gewähr ;D: Ersetzt in der imageflow.js "document.location = this.url;" durch "parent[Framename].location = this.url;" (Kommt 2x vor und Framename muss durch den Namen eures mainframes ersetzt werden.)
@ serienking: Du kannst ImageFlow auch direkt in den mainframe einbinden. Ansonsten empfehle ich dir die aktualisierte Version von dem was oliver gepostet hat:Opening new windows with JavaScript, version 1.2 - http://tinyurl.com/2p2gvl
Finn wrote: @ Oliver: Lies dir mal das durch: http://tinyurl.com/hjsyl iFrame Problem: I almost figured it out. But my current problem is that clicking in iFrame opens the link in parent window as long as i dont scroll through the gallery. However if scrolling the gallery first, the result will be that the link will open within the iFrame and not in the parent window anymore. Who ever comes up with a solution first gets 20EUR via paypal ;) *g*
Ich hab Imagesflow via Frame eingebunden nur leider öffnet sich dann der longdesc in dem frame. wie kann ich machen das der sich der link dann als mainframe öffnet siehe www.serienking.in
@ Cody: Alter the xstep variable (is currently set to 150 try a bigger value... should change something ;D)
Does anyone know how to space the images apart evenly so they don't overlap, even when they're not maximized or in the front?
nevermind, didn't read this whole page, thanks guys. great work by the way.
Hey all, trying to get the image flow to start on the 3rd image instead of the first. Which variable do I need to change in the js file? Thanks.
@Frog: Imageflow already has been implemented with Multibox. I have had a JAlbum skin with both implemented months ago and it has been downloaded over 22,000 times so far. Here is a link to a demo: http://jalbum.macosxsupport.co m/imageflow.html and to the skin: http://jalbum.net/skins/skin/I mageFlow
@ Frog: You're welcome! Have you noticed the donate section ;D
Thanks Finn, that was the solution. Now it works fine!
Potassium Alkaline by Ron Lewis - http://tinyurl.com/kpean
@ Frog: I think I understand what you mean ;D You made a small mistake: It should be glideTo( -450, 3); to start with the 4th image, for it begins the image count internally with 0. Check FAQ #1 for the formula http://tinyurl.com/2wph54
Another time a wrong link, I mean http://www.aizokroon.nl/websit e/portfolio.html
On http://www.aizokroon.nl/portfo lio.html is a test-page with multibox and imageflow. My problem is now that by opening the page the imageflow doesn't work goed, i start working if you first scroll up. I hope you understand it...
I have done it. When i've put it online I will post a link here. I have made a small change in the JavaScript. That was the solution.
@ Frog: No idea. Please post a link to your implementation. have you tried including the imageflow.js as the last JavaScript in the header?
I am trying to make ImageFlow working with MultiBox (http://www.phatfusion.net/mul tibox/), but there is some JavaScript code conflicting with ImageFlow. That javaScript code is this: var box = {}; window.addEvent('domready', function(){ box = new MultiBox('mb', {descClassName: 'multiBoxDesc'}); }); Do you know why that causes that ImageFlow doesn't work anymore?
@ Carlos: No problem - if you like it so much, you can support ImageFlow with a donation ;D
Finn. Thank you so much! I love imageflow w/lightbox.
@ P.DrO: Add the following line in the screen.css to the #scrollbar{} CSS definition: margin-top:40px; That should lower the scrollbar by 40px.
@ FileForDivorceOnline.com: Contact your webhosting support and ask for PHP! There is a step by step installation guide in the documentation ( http://tinyurl.com/3y567l ). But that does not cover anything concerning your webhosting.
@ cy-one: Nope, das habe ich nicht dokumentiert. Eigentlich supporte ich hier ImageFlow auch nur "as it is". Was möchtest du denn kombinieren?
@ carlos: You need to add the following in the screen css to the #imageflow{} definitions: width:600px; That would set a fix width to the imageflow container. Replace 600 by a number, that fits your needs
How can I lower the scrollbar? Great work.
04:38 - FileForDivorceOnline.com
I would really love to make this work. I have been trying for whole day. The thing that does not work is reflection.js. I do not know how to install a GD library or php or any of that good stuff. It would be really helpful if someone could write simple, easy, step by step installation of this great script.
Bin mal so frei, auf Deutsch zu schreiben :) Ich hab neben der offiziellen ImageFlow auch die mit LightBox2-Support entdeckt. In der Beschreibung steht nur was von "mit Unterstützung, einfach gemacht" und so... Gibts auch irgendwo Info WIE das gemacht wurde? Falls ich andere JS-Sachen verwenden möchte.
I know I can change the image size the screen.css file but what do I need to type what line do I need to change? Can someone help?
Ok, so I found answers... Lightbox is really cool and I liked this demo in an earlier post http://194.95.111.244/~countze ro/scripts/_myImageFlowLightbo x2/ also if you use a mac moving the mouse over the pictures and moving two fingers on the touchpad will automatically scroll through the fotos seamlessly without clicking.
Hey, so I like Jake's idea. but check out http://www.fox.com/fod/ , jumpman23.com, and the TV Shows category of the iTunes store. I personally like just clicking on the pictures down the line to scroll instead of using the mouse position, but I wonder if you could make the picture zoom bigger on the click or go into a "greybox" type effect http://orangoo.com/labs/GreyBo x/ that makes a window without opening a separate browser window.
Great work with ImageFlow Finn! How hard would it be possible to blur out the images at the back?
Hi, I just saw your ImageFlow 0.9 I was wondering if its possible to remove the bar and make it so the scrolling happens simply if the mouse is right of vertical center or left of vertical center. I'm not a programmer but I think that function would make the ImageFlow look really cool.
@ Justin: That what you see is a reflection of the Image. Look at this example: http://194.95.111.244/~countze ro/myCMS/index.php?c_id=5&s_id =21 Try to fill your image folder with "real" images.
Why are my images tiled vertically? Here is a simple example page: http://demo.fieldlogixgps.com/ beta/test.html Thanks greatly.
@ S: ImageFlow is free - You are free to use this in any product, or on any web site ( http://tinyurl.com/2lzubt ). A Donation ( http://tinyurl.com/2tl5ly ) is highly appreciated ;D
I was not able to locate the license policy, could you pls point me to that. want to use it on our site. would be glad to paypal something.
found a bug in IE7. click on the time line, not where the bubble is, but anywhere else, get a "Member not found" error.
@ Kristin: Check the FAQ #1 http://tinyurl.com/2wph54
I was wondering - I want my default image to be the middle one - instead of the first one - so that there are images on either side, when the page is first opened. Any ideas on what I need to change in the JS file to accomplish this? Thanks!
Thanks!!
@ ks: There is a proof of concept with ImageFlow and the Lightbox2 - Check it out: http://tinyurl.com/2jpbjn
Hi...ImageFlow is great...n thanks for making it available for free... It'll be perfect if you can enhance it a bit more by combining with something like this http://mjijackson.com/shadowbo x/ This way visitors won't hav to go back n forth in the browser and this will make the website which uses image flow looks more classy
Imageflow is wonderful! Theres a big in ie6 tho(big surprise there). If you rescale the window slowly, the imageflow will sometimes drop to the bottom of the page instead of resize in place.
ImageFlow 0.9 online - Happy Debugging Release: http://tinyurl.com/2jfwwb
@ Frog: What do you need the next/prev buttons for, when you have ImageFlow at your hands? ;D
@Finn: And now support for te next and previous buttons in lightbox! PS, the arrow keys are not working anymore with that lightbox hack (I am using safari 3).
I saw that but I cannot figure out which section I need to edit. I'm new at it.
Real American: http://tinyurl.com/2opg39 ;D
Hooray! Florian Zeidler made ImageFlow 0.8 FULLY compatible with the lightbox2 effect. Now only the centered image opens in the LightBox2 on single click. I updated the Demo - Check it out: http://tinyurl.com/2jpbjn
@ Carlos: FAQ # 9 http://tinyurl.com/2wph54
Does anyone know how to change the image size? Mine are all small.
@Mike: The new version has got a different look, that i like much more. That is what i mean with a newer version.
@ umesh kharade: Teh english documentation is after the german Dokumentation - Check http://tinyurl.com/3b3h3a If you don't need any reflections strip the reflect.php?img= from each image src.
Nice Sir, But i hope i will be able to use it some ware its an excellent work by you but documentation is not in English. can i use it without PHP file of reflection umeshyesh@gmail.com
@Frog: I made the imageflow JAlbum skin (which uses multibox as the lightbox) and it uses imgeflow 0.8. I'm not sure what you mean by an old version?
@Frog Thank you Frog. But in your version the scrolling doesn't work. The scrolling when you klick on an image which is not at the center position. And exactly this is my problem ...
Sorry, the correct webpage is without that space, so http://www.aizokroon.nl/websit e
@Flo: On my test-page (http://www.aizokroon.nl/websi te) i have created a ImageFlow with Slimbox. I have done i with the jAlbum skin of ImageFlow (an old version). Maby you can get hold of that older version, or maby you can you use my version
http://megastruction.com/Integ rity%20Windows%20&%20Siding/ph otos.html
Hi Finn! My images are coming out very small. I read the documentation saying you can set the width in screen.css file. How do I do that? http://megastruction.com/Integ rity%20Windows%20&%20Siding/ph otos.html
@Finn: Hab ich schon probiert... Hat aber leider auch nicht geholfen... Hast Du oder jemand anderes sonst noch ne Idee???
Hat schon jemand imageflow mit slimbox zum laufen gebracht? Ich habe das Problem, dass imageflow.js und slimbox.js sich nicht vertragen. Je nachdem welche ich als erste einbinde, funktioniert nur die slimbox lightbox oder aber es funktioniert nur das scrollen. Bei beiden Varianten werden aber die Bilder geladen.
ich kenn mich nicht so gut aus ... sry .. könntets du mir rklären was ich tun muss ?! hier siehst du wie es auf meiner Hp aussieht http://karate-robin.de.tl/Tite l-der-neuen-Seite.htm bitte helf mir ..
@robin: Da Du das Ganze direkt in den html-Code eingebunden hast, anstelle im Header auf die imageflow.js und das Stylesheet zu verlinken, muss ich passen. Überprüfe doch mal alle Links. Die Bilder kann ich schon mal nicht Finden...
@ Carlos: Can you post a link to your implementation?
@ Boetti: Binde mal die imageflow.js als erstes JavaScript im Header ein. Es kann sein, dass deine anderen JavaScript Frameworks dann funktionieren...
I was meaning to say Vertical instead of Horizontal.
Hello Finn, I am using your script and it is amazing! I am experiecing a problem with the alignment of images. They are Vertical in Horizontal. I can't seem to fix it. Can you help?
Hi! Weiss irgendjemand was von Konflikten in Verbindung mit jquery.js oder interface.js??? Bekomm das script nach dem einbinden auf meiner Seite nicht zum laufen.... http://beta.hsgks.de
@timo .. hast du ICQ oder MSN ?! wenn ja kannst mich ja adden .. ICQ = 434294296 MSN = fazer-D@hotmail.de
@ timo -- sry tut mir ledi so sols aussehen ( http://194.95.111.244/~countze ro/scripts/_myImageFlow/ und so is es auf meiner hP http://karate-robin.de.tl/Tite l-der-neuen-Seite.htm
@robin: Dir ist aber schon bewusst, daß in der Codebox der inhalt des Imageflow-Javascripts, des zugehörigen Stylesheets und des div-Containers für die html-Datei zusammengeschrieben sind? Wie soll man da erkennen, wo das Problem liegt? Ein Link auf die Seite wäre vielleicht besser, so daß man den Quellcode im Einsatz begutachten kann...
hallo an alle ich brauche diese diashow als Java weil meine hp nix anderes snerkennt oder nimmt .. mein freund hat mir das geschrieben help plS = ( http://www.homepage-baukasten. de/forum/viewtopic.php?p=49603 7#496037 )
@ Flo: Nope, sowas gibts noch nicht. Ist halt auch etwas komplexer zu realisieren als meine kleine LightBox Demo, weil das OnClick Event im Lightbox Code nur für das Bild, was gerade zentriert ist freigeschaltet werden darf... Ich fände übrigens Highslide in Kombination mit ImageFlow lustiger ;D
Hej, Finn, gibt es schon eine Möglichkeit imageflow und lightbox zu verwenden aber das es weiterhin funktioniert direkt durch klick auf die bilder zu scrollen? Pothovens Version habe ich mir schon angeschaut. Aber ich will in der lightbox Ansicht mehrere Bilder anzeigen. Nicht gleichzeitig aber zum durchklicken. Hat da jemand eine Lösung für mich?
Fightclub Flightcard http://www.foxmovies.com/fight club/flightcard_med.jpg
great image gallery script... i was thinking of doing something similar myself.... hm, no need for that now - your's is perfect... nothing for me to do :-( great work!
Hey Finn! Gibts auch ne Möglichkeit, die Bilder so zu positionieren, dass sie genau wie im iTunes Flow ausschauen?? Man muss da sicher bei imageflow.js verändern - aber davon lass ich ma die Finger. mfg zer0
Hi Finn! Tolles Script! Gibt es ne Möglichkeit das aktuelle Foto in der Mitte einen Alpha von 100 und die anderen im Hintergrund einen Alpha von 50 haben? Denke das würde ganz schmuck aussehen...
@ Oliver: Lies dir mal das durch: http://tinyurl.com/hjsyl
@ Uwe: Ich habe an die E-Mail Adresse in der contact Seite von menschenfotografie.de geantwortet.
Hi Finn, Ich benutze joomla und habe es soweit geschaft ImageFlow darin durch einen iframe im content einzubinden. Mein Problem ist, dass ich für jedes Bild in ImageFlow einen Link zur Gallerie des Bildes hinterlege und dieser Link jetzt nur im iframe geladen wird. Dadurch sehe ich die Seite quasi doppelt: 1mal im normalen Fenster und dann nochmal im iframe. Ich bin nicht besonders gut mit javascript und weiss nicht wo und wie ich es da einstellen muss, dass der link im "_parent" geöffnet werden soll. Vielleicht könntest du mir da weiterhelfen? Vielen Dank und beste grüße, Oliver
@ Finn: Nun habe ich meine Website mit Imageflow fertig http://www.menschenfotografie. de Es sieht sehr gut aus. Da ich weder bei moneybrockers noch bei paypal ein Konto habe, schicke mir doch bitte Deine Bankverbindung per Email. Viele Grüße Uwe
Hi Finn, der IE6-Bug (Ungültiges Argument in Zeile 141) existiert auch auf deiner Demo-Seite. Ersetze die Zeilen 140-142: image.style.height = new_img_h + 'px'; image.style.width = new_img_w + 'px'; image.style.top = new_img_top + 'px'; durch: if(new_img_w && new_img_h) { image.style.height = new_img_h + 'px'; image.style.width = new_img_w + 'px'; image.style.top = new_img_top + 'px'; }
Google Sky is online for your webbrowser: http://www.google.com/sky/
@ mistered: FAQ #1 http://tinyurl.com/2wph54
Hello Finn, I'm a french user and i want to known how to init the script to arrive directly on the 4 or 5 or 6 image not the first like the original behaviour of your wonder script. Thx U
@ Giancule: only if you implement AJAX which fetches the images on the fly... But that would be combined with all the problems of AJAX ( http://tinyurl.com/3amjcl ). I would ask myself if I really need to publish that amount of images ;D Sure, use it whatever you want for...
Hi Finn, I am using imageflow with a number of images exceeds 100, there's some trick to ensure that the images are loaded dynamically and not all at once? I can use ImageFlow in a GPL software? Thanks
Dolby/DTS/THX Trailers (DVD VOB): http://tinyurl.com/bvg7n
Hey Leute, ich sehe gerade den Wald vor lauter Bäumen nicht. Kann mir jemand sagen an welcher Stelle (Zeile) das Verhältnis der Vergrößerung zwischen "Hauptbild" und den anderen Bildern berechnet wird?
@ myself: http://tinyurl.com/2lw73m
@ timo: hat natürlich ich minte senkrecht :-) ... tut mir leid, es ist noch früh morgens ;-)
@Sasha: Ohne Link oder zumindest einen Screenshot ist Dir kaum zu helfen. Aber waagerecht (=horizontal) ist bei ImageFlow normal. Meinst Du etwa senkrecht?
Bei mir wird der ImageFlow seit dem ich ihn auf einer seite eingebunden hab, immer waagerecht dargestellt. weiß jemand von euch warum? ich habe das script nicht geändert.
@Sizza: Ohne Dir zu nahe treten zu wollen: Einen Grundkurs in html und Seitengestaltung kann ich Dir leider nicht geben. Dafür gibt es Bücher, VHS-Kurse und natürlich das Internet selbst ( http://de.selfhtml.org ). Für ein zentriertes Layout gibt es z.B. die ie hack Version ( http://tinyurl.com/2lmeyt ). Dein Layout kann schon mal garnicht zentriert sein, da für das imageflow-div im css "margin-left:350px;" steht.
http://sizza.de/ssd.html das ist der Link. (Ich habe noch keine Bilder rein gemacht) Ach ja, und ich würde mich freuen, wenn ihr mir noch mehr Tipps geben könntet was ich da alles besser machen kann, damit es besser aussieht.^^
@Sizza & Uwe: Mit einem Link zu Eurer Problemseite wäre es einfacher Euch zu helfen. Da meine Kristallkugel leider in Reparatur ist, kann ich Euch ohne Einsicht in den Quellcode keine möglichen Fehlerquellen nennen...
Hey Leute frage einfach mal hier^^ Also da ich mich nicht so perfekt mit HTML u.s.w. auskenne, gestaltet es sich mir äußerst schewer die Bildergalerie "Imageflow" zentriert in der Mitte meiner Seite einzu binden. Verschieben geht nicht, und ich weis nicht wo ich das einstellen kann. Könnt ihr mir das sagen?? Wäre nett Bunte Grüße Sizza
HI, i know that it is possible to use clickable images to open in a new window using the "longdesc=" in the script, however can you specify the clickable images to open in a new pop-up window that is a fixed size and has no menus/sliders? lovely work by the way!!
Ich habe ein Problem mit dem IE. Mit der 0.7 geht es, außer das die Bilder vollkommen fehlerhaft positioniert werden (die Höhe des Divs drumherum passt nicht), aber mit der 0.8 kann ich zwei Bilder sliden, aber dann steht das alles und nichts geht mehr. Woran kann das liegen?
@Sebastian Diese Funktion hätt ich auch gern. Derzeit verkleinert ImageFlow ein 130x208px großes Bild in 80x128px. Da es sich bei mir aber um Produktabbildungen handelt, wird das zu klein. Kann man ImageFlow so einstellen, dass es die Bildgröße nicht mehr in Abhängigkeit des div-Containers berechnet, sondern z.B. in Abhängigkeit des Bildes?
Gibt es die Möglichkeit, dass das Bild welches im Focus steht die Orginalgröße hat, wie es abgelegt ist? In meinem Fall reicht mir es auch ohne Reflexionen.
der link gehört dazu sry http://www.bilder-space.de/sho w.php?file=sgh24GxRZkUxHRG.JPG
keine ahnung woran das liegt aber der IE stellt imageflow flasch dar >.
When my mouse is on one of the images, a yellow line with the description shows up. Is there a way to disable it?
@Lydia: *ARGL* Who actually still USES the IE5? That is criminal and dangerous! ;D Sorry no support for that thing. I really tried making ImageFlow compatible with every ACTUAL browser, but there is a border. I mean I coded the thing and ca. 50% of my time went into solving compatibility issues! And when it comes to such dinosaurs like the IE5 - I just quit. Probably a CSS error... Also have a look at http://tinyurl.com/2mhqxw
I think it is a great skin!! thanks a lot, but the image's don't show up in IE5?? I know only a few people are browsing with IE5 but I would like the album should work in IE5 to
iBand - Life is Greater than the Internet: http://tinyurl.com/394rm6
@Rating: Do you change your images often (dynamically). If not, you could create your image gallery once for all. Reflections are added to the images only once upon creation of the gallery. PHP isn't even needed. Have a look at this: http://jalbum.net/skins/skin.j sp?id=197
@ kaspine: Currently not, sorry... o O ( I definitely need more time ;D )
Hi Finn, Great code. Do you have plans to rewrite the reflection code using javascript? (I saw it done recently by mooFlow)
I know, Finn. I knowingly disabled the reflections because they slowed the site so much. I guess I have to make the folder wriotable. Ill try to do that tomorrow.
@ Rating: If $_GET['cache'] = 1; the cache function is enabled. But your current images are not generated via the reflect.php for it should be an img src like http://194.95.111.244/~countze ro/myCMS/content/ImageFlow_Dem o/reflect.php?img=img/img003.j pg
I see! However what should I change? I guess its something here: "// CACHE! EVERYTHING! $_GET['cache'] = 1;" or here: "// To cache or not to cache? that is the question if (isset($_GET['cache'])) { if ((int) $_GET['cache'] == 1) { $cache = true; } else { $cache = false; } } else { $cache = false; }". Which line should I change and what should I write istead?
@Finn: Gibt's 'ne Möglichkeit, dass jedes Bild sofort nach dem Laden dargestellt wird? Besonders bei vielen Bildern und langsamer Anbindung wäre das vorteilhaft. Momentan muss der Besucher erst das Laden aller Bilder abwarten.
@ Uwe: Um die links ganz rauszunehmen musst du leider derzeit noch manuell 2 Zeilen in der imageflow.js löschen oder auskommentieren. Das sind Zeile 166 und 252. Dann sollte onclick und ondblclick nichts mehr passieren...
@ Rating: I guess your reflect.php generates the images dynamically on every load. Check, that the cache option of the reflect.php is enabled and that the folder where it caches the images is writeable for the script.
Thanks a lot, Timo :). Does anybody know why without using the reflection the applet loads much faster for me, and what could I do to make the reflection faster?
@Rating: open imageflow.js and set "conf_reflection_p" to "0.0". This will bottom-align the pictures and text will be below them (where reflection would be).
I stopped using the reflection because it made the gallery load a lot slower. I dont know why, but it did. A diffrent subject: Can someone tell me how do I change the location of the description of the images? I dont want it to apear on the image. http://logosempire.2ya.com
@ Finn: wir haben jetzt Deinen Hinweis für den MS IE6 eingebaut und es funktioniert. Du kannst Dir unsere Testseite hier anschauen: http://www.menschenfotografie. de/test/test.html Wir sind gerade dabei meine Website neu zu gestalten und wollen dabei die Bilderschau mit imageflow machen. Ich finde, dass sieht ganz klasse und sehr modern aus. Dazu noch eine Frage: Ich möchte vermeiden, dass wenn auf ein einzelnes Bild geklickt wird, eine neue Seite aufgeht. Kann man diese URL-Verknüpfung irgendwie abstellen?
@ Uwe: hmmm... versuch mal das: http://tinyurl.com/3225gr habe ich aber auch noch nicht getestet. Kannst du hier einen link auf deine ImageFlow Implementierung posten, damit ich mir das mal anschauen kann mit den workarounds?
@ Finn: Guten Morgen. Vielen Dank. Das funktioniert jetzt. Ich habe dasselbe Problem mit dem Internet Explorer 6.0 von Microsoft. Gibt es da auch ein workaround?
@ Uwe: probier mal folgendes als workaround: http://tinyurl.com/233h6o
@ Finn: Mit Safari 3.0.4 läuft ImageFlow nicht einwandfrei. Wenn ich den Scrollbalken etwas schneller bewege, werden einzelne Bilder oder das ganz Feld weiss unterlegt, als wenn ich es markiert hätte. Wenn ich den Scrollbalken ganz langsam bewege, taucht dieser Effekt nicht auf.
@Finn Ok, I see, thanks for reporting!
@ kaya: That one ( http://tinyurl.com/2d7lhr ) breaks with Opera 9.25/WinXP SP2... and looks like that: http://tinyurl.com/yu3rz8
@Finn Which reflection mode did you use? JAlbum, phpV2 or phpV3? Do you have a screenshot?
Kann man die Anzeigegröße der Bilder im Flow beeinflussen und wie? Welchen Einfluß auf die angezeigte Größe hat die Größe der Original-Bilddatei?
@ kaya: Neat. But I get a reflection problem with the gif reflections (video 'n folder icons) using Opera.
I've released a new version of my JAlbum skin "LightFlow" which incorporates Finn's nice javascript lib. Here is the new version: http://jalbum.net/skins/skin.j sp?id=197 And here is a sample album: http://agahd.free.fr/JAlbum/Li ghtFlow/examples/
@ Stef: I don't really get it, but I have an idea. Do you want something like that? http://tinyurl.com/2jpbjn
@ Timo: Was denn ;D Ich will es eigentlich nicht ausarten lassen. Das ist ein "simples" JavaScript und kein ausgewachsenes Programm und ein Forum müsste ich noch mehr administrieren als diese Shoutbox. Ich helfe gerne, aber wenn Fragen zu komplex werden, als dass man sie in 2/3 Sätzen hier posten kann, dann ist eine E-Mail sowieso der bessere Weg. BTW: Benutz mal die Suchfunktion deines Browser in der Shoutbox ;D
@ KLD: Das wird schwierig... man kann relativ einfach Dinge machen wie oben aligned oder mittig aligned anstatt dem derzeitigem unten aligned... Aber wenn man solche sachen machen will wie Bilder kommen von links oben und gehen dann nach rechts unten, dafür muss man sich den Code gaaanz genau ansehen und verstehen bevor man da eine Zeile ändert/das Gewünschte erreicht... Ich würde hier eher vorher mal diskutieren was der Sinn/Vorteil von bestimmten Darstellungsvarianten ist.
die frage von KLD interessiert mich auch. das was ich dir (KLD) schon einmal sagen kann, du musst dann die posiionen genau berechnen, wo die bilder links und rechts stehen sollen...jedoch wie man das macht, weiß ich leider auch nicht.
Hello Very simply to use your javascript but some questions : 1/I want to disable click on image How Can I do this ? 2/I want to center img when I click on ... 3/ I want to :1 click : I see img and when I click again I m come back to galery 4/ thanks a lot for your script !!! If you want ypu can mail me here : passimal at gmail dot com
Kontrolllesen macht schon Sinn: Shoutbox schreibt sich ohne "c".
Das ist meine Art, mich für das Imageflow zu revanchieren. @Finn: Schon mal über ein Forum anstell einer Schoutbox nachgedacht? So langsam wird es hier unübersichtlich...
@Timo Dank deines Links habe ich den Fehler gefunden und nun funktioniert es einwandfrei und es sieht auch noch Klasse aus. Vielen lieben Dank.
kann man in diesem imageflow die bilder die rechts und links neben dem mittleren stehen, alle anders positionieren? sie laufen ja alle paralell, ich will sie seitlich anordnen...ist dies möglich? bei verständnisproblemen einfach nachfragen. Danke. MFG
@Timo Ich kann aber nur den von ImageFlow selber die position mitgeben. Denn die im Shopsystem dürfen sich ja nicht ändern. Ich werde die heute abend einen Screenshot schicken, denn dann bin ich wieder zuhause am heimischen Rechner.
@Ron-da-Don: Sieht genau so aus wie der Fehler den ich anfangs hatte. Ich habs mit dem IE Hack für zentrierte Layouts ( http://tinyurl.com/2lmeyt ) und mit position:relative für die übergeordneten divs hinbekommen. Zeig mal einen Screenshot was passiert, wenn Du nur für die übergeordneten div-container (außer dem body selbst) position: relative angibts.
@Timo: Da das ganze Problem nur auf dem lokale Shop passiert, kann ich dir nur einen Screenshot geben: LINK: http://www.nastyfolks.com/test /problem.jpg Ich hoffe es hilft ein wenig, ansonsten stehe ich hier am Ende mit meinem Latein
@Ron-da-Don: Um Dein Problem zu verstehen wäre ein Link bzw. ein Screenshot recht hilfreich. Ich verstehe auch nicht, was genau Du schon probiert hast. position: relative als zusätzlicher Punkt für div-container zerschießt Dein Layout? Ist für psition überhaupt irgendetwas definiert?
@Timo: Der Rest des CSS-Codes ist das Stylesheet vom Shopsystem und wenn ich das ändere, dann zerschießt es mir den Shop. Ich habe schon einmal die Variante mit einem ausprobiert, doch leider muss ich, um ein Bild zu verlinken mit einem arbeiten, um das verlassen zu können. Doch dann zerschiße es mir wiederum das ImageFlow Layout, sobald ein umd das drumherum ist.
@Ron-da-Don: Wo ist der Rest des CSS-Codes? Der Teil in den die übergeordneten div-Container definiert sind? Ich vermute ja ein ähnliches Problem wie bei mir. In meinem Fall musste ich bei allen übergeordneten divs nur position:relative definieren.
Ich bin es schon wieder. Bisher hat alles wunderbar geklappt. Im Moment versuche ich die Bilder mittig in einem div zu positionieren. Leider verzweifel ich gerade daran. Ich habe das CSS dahingehend abgeändert, dass der "Slider" in der Mitte des divs ist. Nur leider werden die Bilder nicht mittig dargestellt, sondern sie laufen immer nach links heraus und laufen somit in einen anderen Container, der aber für Artikelbeschreibungen ist. Kann mir vielleicht jemand helfen? Hier der Link zu meinem akutellen CSS-Code: http://www.nastyfolks.com/test /image.css Gruß Ron-da-Don
Thanks, Ollo. Really helped me there. One last help- When I click on the picture it opens in a new window. How do I define that the new window it opens at is at full screen?
@ rating > please see the css of imageflow in #scrollbar modify this ligne : border-bottom:1px solid #b3b3b3; - for ex by: #ffffff anybody for answer my request about vertical images problem of alignment?
OK, I managed to make the reflection working. I would still like to know how to change the color on the slide bar. Please drop me a line if you know how to do it.
One problem regarding many images and low bandwith connection: The script first loads all images and then displays them. A better way would be to display the image when it is loaded. Is there a way to do this ? Something like a screen refresh after every loaded image.
First of all, let me thank Denis for helping me out. However I still have usolved issues I would like to get answers on. 1. How do I change the color of the slide line? 2. How do I set the reflection? Meanwhile you can see how my imageflow looks this far: http://www.netone.co.il/logose mpire/index4.html Thanks a lot in advance.
The FAQ's say that you cannot have more than one imageflow per site. Does this really means per site or can I have more than one as long as it is on a seperate web page.
Thank yo so much, Dennis. My Email address is junktomer@gmail.com . If you can also write where I should paste the script, that would be great.
Rating, it is possible to do that. I tried to past the code but it doesnt do. Give me your email adress and I will send you the script code to open your link in a new window.
Hey I really want to use this script, however just as I finished working on it I found out there is no way of opening the image in a new window. It really screws all that I wanted to do with the script. Are you sure there isnt anything I can do? Here is my website, try clicking on the image and see what I mean: http://www.netone.co.il/logose mpire/index3.html
And for those who speak english. There are some translated poems on the website I recently created - Enjoy ;D http://www.arnerautenberg.de/T ext/Uebersetzungen/Meine_Gedic hte_in_anderen_Sprachen
Arne Rautenberg hat nun eine Webseite, welche auf einer verbessertene Version von myCMS basiert. Check it out: http://www.arnerautenberg.de/
Thank you for the imageflow scripts!
hello, many thanks for your work, i'm using IFlow with Lbox and i'll donate by paypal but after that i'd like some help to fix size problem with vertical images that are not centered here: http://0ll0.free.fr/pao_affKvo 2.php centering look like better with horizontal ones here: http://0ll0.free.fr/pao_cds.ph p so i'd made a try with vertical ones i have adding some black borders to fit in centering, but i's not clean with reductions so... someone could help please? what must i modify in Js template to have a better centering with vertical images? thanks franck.co(at)free.fr
Hello! I just started to get in touch with html and javascript two days ago. I found your image flow with Lightbox 2 and I want to modify some things in the lightbox thing, but I have no idea to do so. Here's my problem: Say we have 3 images on the website. 2 of equal size and one different. There is this animation from 250 x 250 pixels to the image size, when i click the first time on an image since I have visited the homepage. After that, if the next image is of the same size, there no white box animation, but if the image differs in size, there is a animation from the old to the new size. What i want to to is the following: for each picture i want to use the initial values, meaning: every time there should be an animation from 250x250 pixels. This scenario is equal to that I visit the homepage after every image again. So I went to the lightbox.js and called the constructor after every click on an image. It works for the white box itself, but not for the image. I get the following effect: The first image is loaded properly, changing to another one gives me the correct resize of the box from 250x250 pixels, but during the resize the new image can be seen in the size of the old picture. after the fade effect, the image vanishes and is shown in correct size in the box after the blend-in effect. I have no idea where to hide the image. Can you tell me how? Thanks for help!
Hallo zusammen, ImageFlow ist ein absolut fantastisches Script. Großes Lob an den Autor! Daher möchte ich gerne auf den Einsatz des Scriptes auf http://www.real-buddy.com/gall ery.html hinweisen. Die Bilder des Imageflows sind mit den einzelnen Blog-Beiträgen verlinkt und ermöglichen so einen alternativen, visuell basierten, Zugang zu den Blog Einträgen.
This Glassbox www.glassbox-js.com looks nice too. Perhaps there is a way to combine the transparent frame effects it with Imageflow.
ok so hab ihc nun ne lösung das der die bilder automatisch aus dem ordner liest... und auch das die bilder gecacht werden.. aber wie kann man in dem normalen imageflow style unten nen footer so einbringen das der so halb über der reflektion steht
Hey Ho gibt es schon nen fertigen php code der den "img ordner" ausließt so das man die links net manuel erstellen muss? wär cool... danke lg Vale
There is a bug in ImageFlow script when rendering gallery with size of one image. Trying to drag scroller causes javascript errors. The cure: use this condition in function drag(e): if (max > 1) { glideTo(new_target, new_caption_id); }
@Ron-da-Don ... one possible solution more : please look at Steven Pothovens "ImageFlow with Lightbox" ( http://tinyurl.com/3c26uu ) - available as a packaged sample!
@Ron-da_Don: Keine Hyperlinks einbauen, sondern das zu verlingende Dokument unter longdesc="..." angeben.
Auch ich muss sagen, dass ImageFlow eine wunderbare Sache ist. Gibt es eine Möglichkeit z.B. über JavaScript eine Funktion anzulegen, dass ein Link erst auf dem Bild im Vordergrund funktioniert. Ich habe bisher Hyperlinks eingebaut, doch sind diese schon aktiv, wenn das Bild noch im Hintergrund ist und somit kann der User sich nicht das Bild nach "vorne" holen, ohne schon den Link zu betätigen. LG Ron-da-Don
Nabend zusammen! Erstmal nen lob an den "erfinder" bzw coder is auf jeden fall ne geile sache! Jetz die frage: Es steht ja fest das ich nicht mehrere imageflows gleichzeitig auf einer seite haben kann...gibt es denn eine möglichkeit außer über das alt attribut nochmal die gleiche anzahl an bilderen unter dem slider zu haben die sich dann auch mitbewegen? also das ganze doppelt nur halt mit einer scrollleiste und somit ja acuh nur einem flow in dem eigentlichen sinne.. MFG Howard89
Always shut down your Laptop before it gets stolen ;D http://citp.princeton.edu/memo ry/
Hi,can you tell me how can star in the gallery from the third photo, it0's because i have a gallery of five items and i want that the third item show me firts for the 2 at the sides generate a cool effect... Thanks!
Hi, wirklich eine feine Sache, dieses Imageflow. Leider bekomme ich es nicht ordentlich hin, wobei ich zugeben muss, dass ich auch nicht wirklich viel Ahnung von der Materie habe. Aber so kompliziert schien mir die Anleitung nicht. Trotzdem will es nicht klappen. Wenn ich den kompletten Ordner von Imageflow, so wie man ihn runterladen kann, einfach auf den Webspace lade, läuft alles wunderbar, alles wird so angezeigt, wie es sein sollte. Tausche ich aber nun die Beispiel-PNGs gegen eigene JPGs aus, sehe ich zwar den Ladebalken, aber der Bildschirm bleibt danach schwarz. Selbst wenn ich nur die Beispielbilder umbenenne, z.B. von img001.png nach img011.png (natürlich ändere ich dann auch die index.html) habe ich diesen Effekt. Also sobald ich irgendwelche Änderungen an der Index-Datei vornehme, um eigene Bilder zu verwenden, sehe ich zwar noch den Ladebalken, bekomme dann die Imageflow-Galerie aber nicht mehr angezeigt, sondern nur einen schwarzen Schirm unter der Überschrift. Ich hoffe, ich konnte erklären, was bei mir verkehrt läuft und jemand kann mir helfen. Viele Grüße, Roland
@Andrew: isn't it possible to leave the additional div container and just add something like #imageflow ::selection { background: transparent; /* Safari */ } ? Why do you use a class and no id?
Correction... CSS Should be... .nohighlight ::selection { background: transparent; /* Safari */ } since we're using a class, DUH
02:25 - Safari "Selection Bug"
Just got irritated that Safari liked to highlight everything around the image-flow when you did a click and drag on the scrollbar. Here is the CSS to turn that off: I put the #imageflow div inside of another div with the class of "nohighlight" ... then applied this CSS #nohighlight ::selection { background: transparent; /* Safari */ } The reason we use a container div is because we wouldn't want to turn off highlight functionality for the whole page. Hope this fixes some peoples problems.
Basic css knowledge: #imageflow{ margin-left:350px;} . Got it?
I am having problems with the imageflow being very small and to the far right. How can i make it not be so small and use more of the window? there is lots of space to the left and below it. http://neo.javatech.me.uk/gall ery webmaster(at)javatech(dot)me(d ot)uk
guggst du hier: http://kadir.asani.ch.vu/ wieso is jetz plötzlich der flow vertical ??? :D so ein mist, bei mir geht einfach alles schief, habt ihr ne idee wieso?? mfg zer0
@timo hab ich gemacht, is aber immer noch verschoben . . . jetzt hab ich mal imageflow gelöscht und plötzlich is alles wieder normal -_- ich denke es liegt an dem code, bei dem ich die quelle bzw. den pfad angeben muss, ich weiss eben nich so genau wo ich ihn reinkopieren soll -.- mfg zer0
Werde die nächsten Tage ein Test rausbringen...Ich werde es via php über mein rss feed oder sitemap oder mediarss :-) die Bilder dynamisch generieren lassen..Werde euch zeigen wie es dann aussieht..
@zero: definiere mal tewstweise in den css-Eigenschaften für Deine einzelnen Containern die position (position: relative).
hey leute, das is ja schon recht geil aber schaut euch das mal an Link: http://www.h1z.ch/~kadir.asani /index.html ich hab alles raufgeladen, auf meinem server, imageflow funkt jedoch sind die bilder immer verschoben, hier ist der header plötzlich bis ganz oben geklettert . . . woran kann das liegen, ich hab nur gemerkt, dass wenn ich imageflow weg nehme, die bilder und der header wieder an der richtigen stelle landen
@Finn = ) hey hey lieben lieben dank ich hätte auch ein bischen die augen auf machen könnenn sry fuer den driis aber viel dank genau das wollte ich = )
@ Norrec: Naja, kommt drauf an wieviel du unterhalb des Bildes an Zusatzinfos hinhaben willst ;D Siehe FAQ Nr. 7 http://tinyurl.com/3d2p8q
Hallo ich habe eine frage zu imageflow. unzwar möchte ich damit referenzen darstellen. aber nicht nur die bilder. unten drunter sollen noch texte sein und weitere bilder, das heist das bei jedem scrollen komplett neuer inhalt da ist.wäre das umsetzbar ?
There is an update to my ImageFlow JAlbum skin that now uses reflect_v3.php for transparent reflections, has previous and next buttons on the slider and includes Multibox, a Mootools based lightbox. here is a little demo: http://jalbum.macosxsupport.co m/imageflow.html A link to the skin: http://jalbum.net/skins/skin.j sp?id=196
Also, ich weiß auch nicht woran es lag, aber jetzt klappt es problemlos. Ich schätze mal, das war ein chache problem mit dem browsern (habe es mit safari und mozilla ausprobiert). naja jetzt funktionierts auf jedenfall, warum auch immer :D danke trotzdem, gruß
Sorry :S
Genau so ist es, aber dass ist in diesem beispiel egal was mit dem erstem bild passiert. Machbar? Lohnt es sich? Grus
@ Basti: Das ist eine nette Idee. Du meinst, dass sich so eine Art Kreuz bildet? Machbar ist mit JavaScript eigentlich so ziemlich alles... Die Frage ist nur wie sich dann das Bild, was angewählt wurde verhalten soll, das würde dann ja durch den ImageFlow in der senkrechten Achse ersetzt werden...
Hi Finn, super dein persönliches CoverFlow. Jetzt, eine Frage. Gibt es die möglichkeit dass wenn du bis zu einem bild "flowst", dass dann in der senkrechten achse ein neues Coverflow geschied mit, z.B. änlichen Bildern? Keine ahnung ob Du verstehst was ich meine. Danke und gruss aus Spanien :)
@Markus > "Gibt es denn eine Möglichkeit die generierten Bilder mit der Reflexion irgendwo zwischen zu speichern?" Ja, JAlbum kann das mit dem LightFlow-Skin machen. Schau mal hier: http://jalbum.net/skins/skin.j sp?id=197
...und weil mich dieses 3D-Karusell gerade so begeistert hier noch eines: http://interface.eyecon.ro/doc s/carousel . Würde mich interessieren, ob das noch jemand so toll findet wie ich!
@Alan: Habe die genaue "Formel" vor ca. 2 Wochen in die Shoutbox geschrieben: http://194.95.111.244/~countze ro/myCMS/index.php?c_id=14&s_i d=15&ShowEntry=1201731330
Hallo zusammen. Habe lange nach einer Möglichkeit gesucht, das 3D-Karusell von Amazon mit Javascript nachzumachen. Eben ist mir das erste Beispiel untergekommen: http://mrjimmo.com/Programming /ImageCarousel.htm Dumm nur, daß die Bilder im Hintergrund nicht kleiner werden. Mit meinen Javascript-Kenntnissen (=0) kann ich da nichts ausrichten...
@ Alan: Jepp genau so berechnet sich das! Naja, wenn man das ImageFlow Script immer als letzes ausführt ;D
Hallo vielen Dank habe alle anderen Javascripts rausgenommen das scheint nun zu klappen. Nun habe ich noch zwei Frage und zwar in der zeile glideTo( -450, 3)der imageflow Datei stellt man ein mit welchem Bild Imageflow beginnen soll aber wie berechnet sich das 450? 3*150=450? Und gibt es eine Möglichkeit Imageflow in Verbindung mit anderen Javascripts korrekt auszuführen?
@ Alan: hmmm... du hast da noch so nen JavaScript image loader Kram nach dem imageflow.js drin. Nimm das mal raus. Wenn das nicht klappt versuch mal soweit wie möglich deine Version meiner funktionierenden Demo anzupassen. FireFox und der IE zeigen keine Fehler, da wirst du irgendwo nen Problem im JavaScript haben... Viel Erfolg ;D
Hi Finn, habe leider ein Prob auf meiner Seite leider funktioniert mein imageflow mit Lightbox nur mit Opera mit IE oder Firefox läufts leider nicht.? Kann aber keinen Fehler finden??.Gibts da ne Lösung? http://alan.tensionband.de
@ Nelson: Hmmm... poste mal einen Link zu deinem Versuch. Ich habe die Lightbox auch einfach nur als Proof of concept in einer halben Stunde programmiert, kann sein, dass da noch bugs drin sind ;D
Hi Finn, ich wollte das Imageflow/Lightbox AddOn auf meiner Website implementieren, aber hab folgenden Fehler gefunden: in der downloadbaren Verison sind 11 Bilder die im Imageflow anklickbar sind; für meine website wollte ich nur 8 Bilder nehmen. Bei 11 Bilder gibt es keine Probleme, bei 8 allerdings zeigt Lightbox bei Bild 2 und 3 Bild 1 an (Bild 1 wird in Lightbox auch als Bild 1 dargestellt). Also wird in Lightbox bei den ersten drei Bildern immer das allererste angezeigt. Sorry, ist ein bisschen schwierig zu erklären, ich hiffe du hast verstanden was ich meine. Ich hab schon alles geprüft, aber kann mir nicht erklären, warum dieser Fehler auftaucht. Was kann man da tun? Gruß
@ Jay: Hooray! Plugins ;D That's very nice. Spread the word! . o O ( Memo for myself: Make a Plugin section in the documentation!!!)
I have created a WordPress plugin for Image Flow: http://www.jethwa.de/projects/ wp-imageflow It is still not finished and currently does not work in IE, but feel free to have a look and make some suggestions :-)
I get the images displayed (not using reflect)...but they do not flow nor does the href work. This is the image source... is this the problem? http://192.168.100.13/ampache/ image.php?thumb=3&id=2649"
@ Legaal: Try something like onselect=return false for the imageflow div.
@Markus: Du kannst durch einen Zusatz im src-Attribut der Bilder auch das Cachen erzwingen, sofern entsprechende Schreibrechte vorhanden sind. Infos hier: http://reflection.corephp.co.u k/v2.php
Can't get Imageflow to work properly in IE7.No problems in Firefox. When using the slider, it selects the images and the text. ??
Gibt es denn eine Möglichkeit die generierten Bilder mit der Reflexion irgendwo zwischen zu speichern? Ich denke es wäre für jeden interessant der mehr als 30 Bilder darstellen will. Es ist ja nicht nötig, die Bilder jedesmal neu erstellen zu lassen!?!? Leider kenne ich mich in PHP/JS zu wenig aus um das bewerkstelligen zu können. Any hints??? Ich habe ImageFlow so umgewurstelt, dass es mir die Bilder automatisch ausspuckt und ich verschiedene Ordner auswählen kann. Sie http://photo.hirnschmalz.at
Danke, hab eben die Homepage des reflect.php-Erstellers gefunden. Jetzt hab ich das Teil kapiert. Leider taugen Reflektionen mit Alpha nichts, weil sie bei den Bildern im Hintergrund überlappen und so einen unschönen Effekt erzeugen.
@ Timo: Nö, kannst glaub ich sogar gifs benutzen... Viel Spaß damit ;D
Hi Finn, habe jetzt endlich einen PHP Server. Wenn ich nun Reflektionen mit Transparenz benutzen will (alternative reflect.php). Muss ich dann auch png-Bilder anstelle von jpgs benutzen?
@ Samyak: That was not what I meant. There are no images in your ImageFlow implementation, because the src links in your imagetags are either wrong, or the reflect.php has a problem with your images. The following link should display your image plus a reflection (which it currently doesn't): http://tinyurl.com/3cm5c5
Well, the URL is not properly written, so putting it again. It is http://kanjiswami.org/?q=hi/no de/194. The library is cool ... hope to see a jQuery plugin soon.
@ Samyak: You have defined a wrong imagesrc: http://tinyurl.com/3cm5c5 Besides that ImageFlow should work just fine...
I am trying to get it integrated in my Drupal based site but no success so far. Knowing that Drupal pages do have jQuery in them, can you tell me if the imageFlow.js is compatible with jQuery ? Following is link my the site with ImageFlow. http://kanjiswami.org/?q=hi/no de/194
weird. phpinfo shows the GD box, v2.0.28. ::sigh:: It's no FUN without reflections! :) thanks!
nice job dude i love it :))
Maybe someone will be able to make Mikes js-based reflections work sometime...
@ Psycho: Yes. Check the imagelink: http://tinyurl.com/37m65x it says "You are missing the GD extension for PHP, sorry but I cannot continue." If you don't have GD running on your server, try it without the reflections. Check the FAQ on how that works ;D
it doesn't work. Not for me. either on localhost or on website. Running Apache 2.2.x, php5 (4 is no longer available), and all that happens is the progress bar appears in the top left corner of the page. either that, or I get "frames" and no images. Suggestions?
God, again im sorry. I really normally read this things before asking questions. Thank you Finn
@ Uli: Read the FAQ #9 http://tinyurl.com/2wph54
The Piclens plugin works if you put the link rel="alternate" direct behind the head tag.
Imageflow with Piclens support would be great
Hi Finn, thanks for your help with transparent .png. I got one more question. Is there any way to stop imageflow from resizing with windowsize? i would like the foremost image to be always displayed in its original and own resolution so that quality of presentation of image is always max. my example: http://www.umabaluma.com thank you very much! Uli
@ Ryan: This has been found earlier. And there is a workaround in the Shoutbox: http://tinyurl.com/23vfk4
@ Mark: Make a next and previous image and add a onclick event to each, that calls the handle() function. Use handle(1) for the next button and handle(-1) for the previous button. That's all...
@Talkrabb Thanks but I was asking about next an previous links to move from image to image within the same imageflow rather than between galleries.
@ Mark Yes, I made previous and next arrows for Imageflow: www.thaisingles.de
This imageflow 0.8 is just wonderful. I have seen problems with the latest Safari 3.X running on Apple PowerPC. The greatest problem is this: click an image - image opens - click "back" - no more scrolling of images on the original page. This problem doesn't exist in Safari 2.0.4 on PwoerPC
In the Mooflow version of Imageflow, there is an option to click a link for previous and next as well as arrow keys. Is this possible in Imageflow?
I'm using window.open which does work. But it also opens a new window when the page is first accessed. That's not right. I'm trying to fix that.
@ Christine: Jepp: http://tinyurl.com/22zusr ;D
I want the imageflow image double click to open a url in a new window. window.open does not work. Have any ideas?
Wow, how great! Thanks
@ Uli: Yes, check FAQ #4: http://tinyurl.com/2wph54 That also covers transparent images... Beispiel: http://tinyurl.com/39ehcs
Hi there! Thanks alot for your kickass script. I got one small problem to integrate it to my needs. Is there any possibility to use transparent png`s in your script? Thank you for your help!
@Kay: great thing! but one thing i would wish else: can you include the functionality of Steven Pothovens "ImageFlow with Lightbox packaged sample" ( http://tinyurl.com/3c26uu )?! that means to be able to slide each picture by click to focus and open then by a new click in a Lightbox-Frame ... it would be so nice! :-)
I've just published a new example album of JAlbum skin LightFlow: http://agahd.free.fr/JAlbum/Li ghtFlow/examples/ As I said already, LightFlow uses besides Finns javavascript another lib (Lightview) to display photos bigger when clicked. However, multi media files like videos and sound files open in a new window. Non-images files like zip and pdf will be downloaded when clicked. Last but not least, the album may contain subfolders as well. Enjoy :-)
@Justin: thanks so much! :-)
@Sean. Re my last post, ignore the spaces that somehow got inserted into the words getAttribute and intCurrentLongdesc.
@Sean: To add the Up and Down arrow keys, in "document.onkeydown" I added "case 38:handle(-1);break;" and "case 40:handle(1);break;". To enable the Enter key, in "glideTo" I added "intCurrentLongdesc = img_div.childNodes.item(array_ images[caption_id]).getAttribu te('longdesc') ;", and in "document.onkeydown" I added "case 13:if (intCurrentLongdesc > 0) {viewDetails(intCurrentLongdes c);}break;". The "viewDetails" function is a function in my application to go to another page to view the details represented by the image. As for the other changes I've made, I'm polshing them a little more so they're OK to share.
Cheeseburger in a can anyone? http://tinyurl.com/2au9fy
Hey, thanks I really love your work.
They flow, but in their own independent and unique way! ;-) That part is way beyond me, I must say. They only like the right side, it seems.
@Justin: I too would like to see your implementation with the additional arrow keys and especially the use of the ENTER key to follow the link. :)
@ Thorsten: Okay, ich glaub auch, dass E-Mail etwas besser ist ;D
@ the other mike: Nice reflections... now make them flow ;D
@ Mike: I just translated the german installation tutorial. Have a look: http://tinyurl.com/3y567l
@Finn: Da hast Du mit Deinem Einwand natürlich vollkommen recht. Gerade unter Einsatz von Lightbox wäre es wirklich nicht günstig und der User würde den Überblick verlieren. Deinen Gedankenansatz halte ich für den richtigen Weg und sollte unbedingt mal umgesetzt werden. Start/Stop ist ausreichend, vor/zurück braucht man nicht, das wäre zu viel. Als Grafikdesigner bin ich natürlich ein Freund von minimalistischen Lösungen, von daher frage ich mich, ob man den drag-button um diese Funktionen erweitern könnte? Evtl. gibt das aber technische Schwierigkeiten und ein weiterer Button wäre dafür doch notwendig. Vielleicht mache ich mir mal mit Photoshop hier Gedanken. Wichtig wäre aber bei so einer Umsetzung, dass ein Klick auf ein Bild (bzgl. Lightbox) die Slideshow automatisch stoppt. Auch sollte man im JS die Möglichkeit haben zu wählen: slideshow: true/false. Und, ganz wichtig darüber nachzudenken: was passiert am Ende der Slideshow? Einfach Stop, oder fängt sie von vorne an? Evtl. auch hier die Möglichkeit das im JS mit true/false zu definieren. Finn, das sind jetzt aber schon sehr tiefe Entwicklungsideen - vielleicht sollte man das per E-Mail kommunizieren? Ginge auch schneller. Soll ich mal unter Deiner Google-Mail den Kontakt herstellen? Grüße aus Süddeutschland
@Justin: it would be nice to see that in action, and of course the step by step workarounding code to reproduce that.
Can someone write a short installation description. I want this to work in Dreamweaver. I can't manage it. I followed all the descriptions on the site but nothing. please. where to put the files etc.etc. thx
Finn, thanks very much for the great code. In case it helps anyone, when adding ImageFlow to my existing application I made a few small changes: * added navigation with up/down arrows (as well as the left/right arrows) * because people can navigate with the keyboard (i.e. arrows), I made the Enter key do the same as double-clicking the image (I made single clicking do nothing, to avoid inadvertent triggering) * because I have only limited vertical space available for the images, I limit max_height to be no more than a certain number (calculated with getInnerHeight()) and set img_div.style.height, new_img_h and new_img_top accordingly * I removed the horizontal scroller to save space Thanks again.
I have been working on getting a javascript solution to the image reflections rather than PHP. Using reflex.js and a bit of CSS I at least got it to render the reflections correctly but as you can see from my test page: http://jalbum.macosxsupport.co m/flow/ as you start the flow from right to left, things don't flow, lol, but the reflections still get rendered even though the position of the images is incorrect. May not be a solution but the first time i actually got reflections in the right position with javascript.
@ Thorsten: Das geht bestimmt, da müsste man nur einen Timer einbauen... aber wie definierst du Inaktivität? Wenn jetzt jemand ein Bild länger betrachten will und es slided weg, weil der timer abgelaufen ist... Oder jmd. benutzt ImageFlow mit der LightBox und im Hintergrund scrollt ImageFlow weiter, während der Benutzer noch mit seinem LightBox Popup beschäftigt ist? Wenn dann wäre ich eher für eine richtige Autoslide Funktion mit zusätzlichem Button ala Start/Stop... Was meinst du dazu?
@Finn: sag mal ist es nicht möglich folgendes zu integrieren (jemand anderes fragte auch schon mal): nach z.B. 10 Sek. Inaktivität scrollt imageflow automatisch zum nächsten Bild (zeitabstnd natürlich einstellbar). Ginge das??
@ MiREK: Nowhere, I wrote this CMS myself ;D
Please where i download your cool system DRAGONFLY 2.0... THANKS
thank you finn for this wonderful script. for those who will use lightbox2 for the bigger pics use this: [/code] be sure you insert the rel=lightbox[one] to the link.
@Thorsten: Danke für die Bestätigung! @Alle: Hab was nettes gefunden: http://www.sprymedia.co.uk/art icle/Design Ein Praktisches Mittel für Webdesigner.
@Timo: genauso ist es: wenn es am 7. Bild starten soll, berechne die Anzahl der Bilder davor, also 6, und nimm für jedes Bild den Wert "150". Ergibt: 6x150=900 Also "glideTo( -900, 6)" Viele Grüße
Great work! i just got it working on our page, and fully integrated 1) is there any way to make the image thats show bigger? overall? it seems that the smaller thediv, the smaller the images, i was able to change ths in mooflow by changing a variable, but I want to use ImageFlow :) - feels better! thanks in advanced
In Deiner Dokumentation schreibst Du, man soll "glideTo( -450, 3)" einfügen, wenn man mit Bild 4 starten will. Warum schreibst Du nicht wie man rechnen muss, wenn man mit einem anderen Bild starten will? Ist "glideTo( -(x-1)*150, x-1)" korrekt?
Hey Finn - How easy would it be to work a mod which advanced the sequence automatically (that is, made the "next" pic glide to the center) if the user hasn't clicked anything in X seconds? If it could be done it would make a great presentation device!
Wenn es ein Problem gibt mit 2 CSS Dateien, warum nicht einfach das ImageFlow css mit in das des Shops packen (vorzugsweise ans Ende)?! Ohne einen Link zu deiner Implementierung kann ich dir leider keinen anderen Rat geben. Wenn es dann immer noch hapert schlage ich vor, dass du einen Thread im XT Commerce Forum aufmachst... Wenn da eine funktionierende OpenSource Gemeinde hinter sitzt wird dir auch da sicher schnell geholfen!
Hi Finn, wir haben mit Begeisterung dein ImageFlow emfpohlen bekommen. Wir wollen diesen in einen XT Commerce Shop als Start Slider verwenden. Leider verzehrt es mir die ganze Startseite da die XT Software anscheinend Problem mit 2 CSS Dateien hat. Hast du hier eine Anleitung wo welcher Code hinzukopieren ist. Wäre super. Viele Dank.
If you flick with the scrollbar below, you get some textmarking going on....if you set a return true; into the mouse function the text marking should be gone...i didn't test this one yet it could be return false also... error is on safari 3 on MacOS X 10.5.2 soo i will test it, in a free minute
@ Kay (and all the others): sorry, I have forgotten to say, that it's okay now on safari3 OS X. Don't know what it looks like on Win: "The box said: requires Win XP or better - so I bought a Mac"
@Thorsten: Thanks for the info. I'm glad to hear!
@ Kay: I had that flickering at Safari 3. Your solution is working:
The slider is shining trough a highslide 'popup', can that be solved? It's happening because the z-index, but when i lower the z-index the slider disapears behind the pics. Giving the wrapper of highslide a z-index higher than 10010, doesn't help either.
The slider is shining trough a highslide 'popup', can that be solved? It's happening because the z-index, but when i lower the z-index the slider disapears behind the pics. Giving the wrapper of highslide a z-index higher than 10010, doesn't help either.
@Finn: I've found a fix to solve the problem with the flickering display: Just add the following in the scrollbar div: onSelectStart="return false" PS: I'm proud to contribute to ImageFlow :)
@ Finn: Yes, found the thing, but that's not made really smooth
I've found the solution to solve the error on line 141, char 4. I don't know why, but the only thing you have to do, is make sure that the folowing code is in your imageflow css file. CSS code: -------------------------- html, body { width: 100%; height:100%; } --------------------------
@ Thorsten: Concerning the flipping images: Do you mean that sort of stuff, the iphone/ipodtouch does when a album cover is selected? Hmmm... I have seen that in JavaScript already: Check the .Mac Web Galery http://tinyurl.com/3yzfkk (Choose a image and click on the i to get it flipping)...
@ Chris: Sorry, I don't know YUI... But I like your idea ;D I want to build a highslide effect for ImageFlow, that also features drag and drop of the selected images!
Phew Bunch of messages ;D @ Kay: Nope I'm still searching on that one... The Flickering is caused by the Browser trying to make a selection, when your cursor leaves the slider.png - There must be a JavaScript somewhere to force the browser NOT doing that within that div area...
Another thing: Does anybody know about a javascript (mootools prefered), that flips a div like the OSX Dashboard Widgets? That would be so cool to add something like that into imageflow :-)
Finn, you made a very nice job! I used your hacked lightbox2 version to do it with slimbox.
Drag-and-drop. Sorry to put the topic into the NAME field. I basically have to drop-zones, and need a way to define the images being inside imageflow to be registered with the YUI drag-drop. such as (from YUI example): players[0] = new YAHOO.example.DDPlayer("pimag e1", "topslots"); where: #pimage1 { left: 010px; top: 300px; background-image: url(../../examples/images/img1 .jpg);} 1
10:48 - Is it possible to integrate drag-and-drop?
Excellent work! How would I integrate drag and drop functionality of YUI with imageflow? I implemented a psychology project with YUI drag-and-drop, but due to the many photos used, i d love to use imageflow and let the user drag drop images he LIKES and other he DISLIKES. thanks for the good work!
Somebody complained that the slider isn't usable with IE7 under vista because the display flickers. Does anybody has a solution for this? Here is the original thread: http://jalbum.net/forum/thread .jspa?threadID=18736 Here is a screenshot: http://jalbum.net/forum/servle t/JiveServlet/download/11-1873 6-152568-4704/corrupt1.jpg
@Timo: Yes exactly. They are created client-side by JAlbum while album creation. The album is uploaded thereafter to the server.
@Kay: I don't get it. How are the reflections generated? Before uploading?
"plugin section" - Yes, good idea! BTW, I had to customize ImageFlow because I didn't want to use server-side PHP to do reflection since the photo album is generated by JAlbum client-side and then it's uploaded to a server, which serves just static html. As you see, JAlbum in combination with my skin LightFlow does a nice job :)
@ Kay: Nice! Thanks... I should add a plugin section in the documentation.
I forgot to post a direct link to my album built with "LightFlow": http://agahd.free.fr/JAlbum/Li ghtFlow/examples/index.html
Hi Finn, it's just to let you know that I have integrated your neat ImageFlow lib into a JAlbum skin which I call "LightFlow": http://jalbum.net/skins/skin.j sp?id=197 JAlbum is a free photo album generator and the skin LightFlow is my contribution. Thank you for your great work!
@ Matthias: You got it on my newsblog ;D http://tinyurl.com/2qh8vv
Just to let you know, that I just released the first version of ImageFlow for TYPO3. http://typo3.org/extensions/re pository/view/msimageflow/0.1. 1/
@ Timo: Tja ;D Ich finde Zeilenumbrüche auch gut, aber dann kann man nicht mehr so gut die einzelnen Einträge voneinander unterscheiden... Es gibt auch einen netten, der schon genau das kann, was ich plane: http://www.wintec-gps.de/winte c_wbt-201.php Aber ich will das selber hinbekommen *GNAAA* ;D
Here it comes! The "Air fork one" ;D http://tinyurl.com/399y6n
"conf_reflection_p auf 0.0": ZU einfach! Vielleicht wäre ein extra Hinweis am Ende der Zeile sinnvoll für alle die keine Reflektionen haben? "am besten fand ich den Eintrag von Michael...": Das war die Stelle an der ich grinsen musste. Javascript basierte Reflektionen wären cool! Was Dein GPS-Projekt angeht: Ich hab derzeit einen Empfänger, der über Bluetooth mit dem Handy verbunden ist. Auf dem Handy loggt TrekBuddy meine Bewegungen. Nachteil: Zieht enorm Akkuleistung und man kann bei laufendem Programm nur angerufen werden, jedoch nicht "hinauswählen". Zeilenumbrüche in Deiner Shoutbox wären hilfreich für die Lesbarkeit... ;-)
@ Treviño: Okay, just wanted to check if you are aware of it ;D I should really get into understanding JavaScript based reflections! That would make ImageFlow totally clientsided and would allow more mash ups like your flickr ImageFlow...
Ah... Of course a referrer "based" control would be another idea, but we all know that all could define a fake referrer...
@ Pabloko: That's okay, I'm german and rate my english as BSE aka BadSimpleEnglish ;D Could you post a link to your implementation, otherwise I can't really help you (would be guessing only)...
Well, for example I could add a white list inside the reflect-file or some controls like that... But actually I don't think this is a great problem... The only needed thing is a filesize check (don't get/reflect files over a certain size...)
@ Timo: Du kannst die Bilder unten ausgerichtet indem du die Variable conf_reflection_p auf 0.0 setzt... Joa, am besten fand ich den Eintrag von Michael, wo er schreibt, dass ich das Ding viel weiter entwickelt habe, als er es je getan hätte und bei Gelegenheit meine Version benutzen würde ;D
@ Treviño: Wow, such a nice hack ;D How do you avoid naughty people using your script and processingtime to generate themselfes some nice reflections? For example: http://tinyurl.com/yqkgc8
Pabloko, does your imageflow autoplay? :o If it is, could you paste the code? Thanks!
Vielen Dank für die Blumen! Da wir kein PHP haben: wie kann ich trotzdem die Bilder bodenbündig darstellen? Hab gerade die Diskussion mit Michael überflogen. Nett!
Hi, sorry from my english, I’m Spanish. I created function to add buttons play/stop near of point-bar, but isn’t cross browser. You know some procedure to this? Thank you. Pablo
Hi... I've made a small patch against ImageFlow to make it load remote images too. This is the patch: http://paste.ubuntu-nl.org/537 76/ ;) Since I've used file_put_contents it needs PHP5, but it could be easily backported using the clasic fopen,fread,fwrite,fclose,[... ] functions to make it work with php4 too.. Using this script, with a simple phpFlickr-based tool, I've made a cool flickr Imageflow. Here's a demo: http://gallery.3v1n0.net/image flow.php
@ Timo: Nope, einen Wunschzettel habe ich nicht... aber du kannst mir gerne etwas spenden: http://tinyurl.com/2zjnxl ;D
@ Timo: Diejenigen, die sich selbst etwas beibringen, können sich sicher sein, was sie wirklich können/verstanden haben im Gegensatz zu denjenigen, denen etwas beigebracht wird und die dann meinen etwas zu wissen! Ich habe mir den Kram hier auch selbst beigebracht, mach weiter so!
Die Tomaten sind gefallen! In meinen classes "container" und "content" hat "position: relative;" gefehlt. Danke!
Danke Finn, aber ich krieg es selbst mit dem IE-Hack nicht hin. Hab mir html selbst beigebracht, drum fehlt mir vermutlich noch der komplette Durchblick. Da es in Opera funktioniert tippe ich darauf, daß es wirklich am IE liegt und nicht am Code. Hab aber keine Ahnung, was ich ändern muß, um es passend zu machen. Für heute mach ich Schluss. Vielleicht fallen mir morgen die Tomaten von den Augen... Hast Du einen Amazon-Wunschzettel? Ach ja: nie mit kalten Fingern schreiben, da vertippt man sich doppelt so oft!
@ Ilja: Das passiert immer dann, wenn der Cursor das slider.png verlässt und der Browser denkt, dass der Benuzter etwas auswählen will (blaue Markierung). Das macht derzeit der IE und noch ein paar andere Browser... Vielleicht gibts dagegen irgendwann ein Workaround ;D
@ Timo: iFrames sind sowas von ugly ;D Schau dir lieber nochmal mein Beispiel mit dem IE Hack für zentrierte Layouts an: http://tinyurl.com/2lmeyt Das bekommt man alles 100% mit CSS hin, da muss man nur etwas rumprobieren ;D
Sill ich einen Iframe benutzen oder hälst Du das für unsauber?
Hallo Finn, bin gerade über Dein Imageflow gestolpert und habe natürlich sofort versucht, es in unsere Firmenseite einzubauen. Danke für dieses Geniale Teil! "Natürlich" ist es auf Anhieb ein Problem mit der Positionierung unter IE7 aufgetaucht. Mit Opera funktioniert es bestens. Um die Sache komplizierter zu machen musste ich Dein css-file verändern, so daß es mit unserem Seitenlayout harmoniert. Deine IDs habe ich übernommen und soweit ich mich erinnere folgende Änderungen vorgenommen: meine eigenen classes hinzugefügt. "margin-top:50px;" aus der ID "#loading" entfernt "margin-left:350px;" aus der ID "#imageflow" entfernt Das Imageflow selbst befindet sich innerhalb einer class, die wiederum innerhalb des Seitencontainers steckt. Scheinbar hält sich nur der Sliderbalken daran, wo er sich befinden soll... Hier die url: www.blumengalerie-albert.de/bi lder/bilder.html Imd hier ein Shot der Misere: http://img232.imageshack.us/my .php?image=imageflowzc7.jpg Gruß Timo
Hi Finn, many thanks für ImageFlow. In dem Moment bei der Verwendung des Sliders gibt es im Hintergrund einen Farbbalken und manchmal verschwindet der Cursor auf dem Slider-Strich. Liegt das nur an der Browser Version ? (6.0.2900.2180) Falls nicht, hast Du dann ein Tip dafür ? Wie auch immer, ein tolles Script.
@ Nomadus: Remove the XHTML DOCTYPE line when a visitor visits your page with the IE. www.thaifrau.org/fotokarussell Open this page with the IE and with FF and compare the sourcecode.
Oh thx this should really help. ;]
@ Luk: I don't recommend opening stuff in a new window. That will break the link chain and the user can't go back using the back arrow of his browser... If you still want to do that check: http://tinyurl.com/2p2gvl ;D
Hi, i have one problem using this. And i will be really greatfull for any help. My question is: how can i make gallery images being open in new window when you klik at them? I put the img url in longdesc attribute but what should i do if i want this image to be open in new window. Thx for help.
@ Rebekka: Hm, schick mir mal einen Link zu deiner "echten" Implementierung... Wenn das nicht geht versuch mal ein &tint=FFFFFF an deine Img Links dranzuhängen...
Hallo Finn! Danke für Deine Antwort. Das mit der anderen reflect.php habe ich ausprobiert. Die Bilder sind jetzt auch durchsichtig, hat also funktioniert. Allerdings sind die Schatten nach wie vor nicht durchsichtig. Bei dem Beispiel, das Du genannt hast, ist das auch so, allerdings sieht man es nicht sofort, da die Hintergrundfarbe Schwarz ist. Ich verwende jedoch Weiß. Hast Du noch einen Tipp?? Screenshot: http://img126.imagevenue.com/i mg.php?image=63645_Bild-1_122_ 769lo.jpg
@ Rebekka: Klar. Guck dir mal FAQ #4 an: http://tinyurl.com/3d2p8q Wenn du diese reflect.php benutzt kannst du auch durch transparenz freigestelle Bilder einbinden. Siehe als Beispiel: http://tinyurl.com/39ehcs
Hi Finn! Ich experimentiere gerade mit Deinem genialen Imageflow. Allerdings habe ich auch eine Frage dazu. Lassen sich in Imageflow auch transparente PNGs darstellen? Das Problem ist, dass ich Objekte darstellen möchte, die nicht quadratisch sind und ein quadratischer Bildrahmen würde zu nicht sehr hübsch aussehen. Daher die Idee mit den Transparenzen. Wenn ich allerdings jetzt so ein PNG in Imageflow anzeigen lasse, ist das Bild nicht durchsichtig, sondern zeigt einen schwarzen Hintergrund. Kann man das irgendwo einstellen?? Danke schon mal im Voraus für Deine Hilfe.
To get full Safari support you need to set the width AND height attribute in the mainloop. Try to understand what I did in the imageflow.js from line 123 on...
I'm having trouble setting the height and width in javascript to resize an image.. It works fine in IE 7 and 6 but not Safari 1.3+. I've played around with setting the display and visibility properties to no avail. You mention you did a special release for Safari support - what in particular did you have to program for to make Safari work? Code Snippet: function fixImgs(whichId, maxW) { var pix=document.getElementById(wh ichId); w=pix.width ; h=pix.height; if (w > maxW) { f=1-((w - maxW) / w); pix.style.width=w * f + 'px'; pix.style.height=h * f + 'px'; } } Vielen dank fuer Ihre Hilfe...
Sorry about the bad links. Try http://www.jalbum.net and you will see the skin, ImageFlow. A demo is at http://jalbum.macosxsupport.co m/imageflowdemo/ and a description with an inline demo is at http://jalbum.macosxsupport.co m/imageflow.html
@ Mike: Sure, why not! All sample galleries did not work when I tested it... and your link gave me a 500 Server error... But if your implementation does what is written about it: nice work! ;D
I have just uploaded a gallery Script based on Imageflow for Jalbum ( http://www.jalbum.net) It includes a different lightbox ( slimbox). If you want to see it, it is at http://jalbum.net/skins/skin.j sp?id=196. Downloaded almost 4000 times so far! I've included a link to your site as well. I can include more info about imageflow if you like.
@ Sam: Yepp, aber da ich die lightbox2 sowieso als nicht so ideal (!=intuitiv) ansehe, habe ich mich da auch nicht weiter hintergehängt... Wie schon öfters gesagt wurde: Wenn man ImageFlow vernünftig einsetzt, dann braucht man den Lightbox Effekt nicht. Der unterbricht nämlich den "Flow" ;D (und benötigt eine aufgeblasene JavaScript Bibliothek). Aber vielleicht wirfst du einfach mal einen Blick auf Steves Implementierung: http://tinyurl.com/3c26uu
Finn, ist dir aufgefallen, dass in deinem Lightbox2-Hack die Navigation durch die Bilder nicht mehr durch Klicken auf das Nicht-Center Bild funktioniert? Sobald man auf ein Bild klickt, egal ob das eigentlich fokussierte oder eines davor/dahinter, öffnet sich die Lightbox. :
@ Juan: You're welcome! Have you noticed the donate section ;D
Dear Finn, Everything is working perfect, I've made two versions (one for Safari, Firefox and IE 7 and a second one for early versions of IE -that doesn't support transparency). Now you can go directly to http://www.juangiordano.es I've posted the news in my blog (sorry is only in spanish): http://juangiordano.blogspot.c om/2008/01/nueva-web.html Thanks again!!
In regards to the revisions I submitted to Finn earlier (http://tinyurl.com/2vg97z), I made a simple sample application to demonstrate initializing my modified ImageFlow (with LightBox Lite) via an Ajax request to get the image list. See: http://tinyurl.com/3c26uu
Well Finn... errors XHTML are corrected, but it was not the cause, really that comes from “imageflox.js”. Moreover I am not only, I looked at the other pages of example with ie7, and that indicates the same error. It is not serious, it is well anyway. See you !
@ Nomadus: Okay... The IE just says, that you have a error in your document. Check your XHTML, for it is not valid: http://tinyurl.com/348ync
Ok thank you Finn!... With Firefox that functions very well, the error occurs only under Internet Explorer, which indicates that line 141 of “imageflow.js” has a nonvalid argument. It is all, except this small detail congratulation! Another thing... How can post the real size of the foreground image? Friendships www.nomadus.fr
Covers anyone? http://www.freecovers.net/
@ Juan Giordano: Oups... my fault. I fixed the transparency reflect.php! This one should work now: http://tinyurl.com/yseu2z
@Nomadus: No clue... Try the Firefox error console. That displays more information!
Hi Finn, I've uploaded again the alternaive script reflect.php. The address is the same : http://www.juangiordano.es/des ign/ Thanks!
Hello, Do you can to help me ? I would like to know why I have this error message in navigator IE7 “Argument nonvalid - line 144 character 4” of script? In advance thank you
@ Juan: Can you give me a link to such an implementation?
Dear Finn, I must been doing something wrong with the alternative reflect.php, because every time I upload it to my site the gallery loads but there is no images at all ( I've been using transparent gif and png files) Do I have to modificate somthing in the other files? Once I fix those little details i will put it as my homepage with a link to yours. Thanks again. Juan
hallo habe eine Frage zu deiner genialen Image Slideshow. Ich wollte statt Imagecopy Imagecopyresampled und Imageantialias einbauen. Das Problem ist wenn ich alle Imagecopy durch Imagecopyresampled ersetze werden keine Bilder mehr angezeigt. Ich will die beiden Befehle einbauen damit die Bilder durch das automatische resizing nicht so kantig aussehen. Grundsätzlich geht das mit diesen beiden befehlen aber ich weiß nicht so richtig wo ich die unterbringen soll. Hat da einer eine Ahnung. Danke. Grüße BjT
@ Mario: Sure, but I would not do that, because it breaks up the link chain... Have a look at (=understand) http://www.javascripter.net/fa q/openinga.htm and alter line 166 and 252 in the imageflow.js to fit your needs...
Is it possible to have clickable images with URLs that open in a different window? I can't quite figure that one out. Thanks!
@ Juan Giordano: Wow, nice work! You should use the alternative reflect.php to generate images with real transparency - check FAQ #4: http://tinyurl.com/2wph54 (That will cause the reflections to be transparent too! Try if you like it...)
Dear Finn, I've been testing Imageflow in my personal website and I must say it's fantastic. Just a couple of bugs: even though I use Safari on my Mac, wen I tested the site with IE (Windows XP) the slider "act" in a funny way running out of the screen... may be I am doing something wrong. The other thing is, as I am a sculptor, I've been trying to "crop" my sculptures using transparent gif or png files but the result is always a rectangular image with black background. Any Idea? You can check my site here: http://www.juangiordano.es/des ign/ Cheers!
@ Bart: Schonmal in die imageflow.js reingesehen? // Sets the slider cursor type: try "e-resize" default is 'default'
I like the idea of ImageFlow with Lightbox2, but I don't like the overhead and pre-processing of Lightbox2, nor that it required a tweaked ImageFlow. So, I made a LightBox Lite which provides the same functionality. See: http://tinyurl.com/2daxfb
Hi, imageflow ist schon sehr cool. Wäre es nicht besser für den Slider, zwecks Usability, den Cursor Move oder bzw. E-Resize zu nehmen (http://de.selfhtml.org/css/ei genschaften/anzeige/cursor.htm ). Dann verstehen absolut unbedarfte Nutzer das man den Punkt bewegen muß (ok man kann auch ein in der Grafik des Punktes einbringen).
Danke. Weiß noch nicht ob mir das weiterhilft... zentriert wärs jetzt, lag am design herum (ein position relative rundherum, hat abhilfe geschaffen) allerdings werden die bilder im IE7 (6 weiß ich leider noch nicht) unter dem scrollbalken angezeigt...
@ Pointi: Der IE Hack ist für ein zentriertes CSS Layout gedacht. Wenn die Bilder bei dir nur bei dem IE falsch positioniert werden, dann guck dir mal den Quellcode von dieser Demo an: http://tinyurl.com/2jpbjn
I should have done this before submitting the code improvements to Finn, but I ran my updated imageflow.js file through JSLint (http://www.jslint.com/) to clean it up. The new file is still available at: http://tinyurl.com/32kejp
wozu ist der ie6 hack gedacht? bzw. woher bekommt man den? mein außermittiges problem wird er vermutlich nicht beseitigen oder *gg*
wow, bist du schnell :) funktioniert danke! leider hab ich noch immer ein kleines problem *gg* und zwar rutschen die bilder links aus dem div "imageflow" raus, ist das normal? bei mir sind sie dadurch auf einmal außerhalb meines content bereiches ^^
@ Sam: Das ist doch schön. Bitte! ;D
@ Pointi: Setz mal die Variable conf_reflection_p auf 0.0 dann sollte es eigentlich wieder unten ausgerichtet sein...
Mit "centered layout IE6 hack" und dem neuen Lightbox-Hack, sowie den Ergänzungen (sinnvoll!) von Steven wird imageflow immer besser! Aktuell bin ich wunschlos glücklich damit, danke! :)
Hallo nochmal, danke für deine schnelle Antwort! Großes Lob :) Habs jetzt erstmal ohne Reflexion eingebaut, allerdings fällt mir auf, dass meine Bilder nicht alle auf einer "Ebene stehen" alsoin verschiednenen Höhen sind. Beim Beispiel sind alle praktisch auf einem Niveau, von wo weg zu gleich die Spiegelung beginnt. Liegt das jetzt an der fehlenden Spiegelung, oder an etwas anderem?
Bad Usability Calender 2008 (Just great ;D): http://badusability.com/
@ Pointi: Naja, wenn du die reflect.php umschreibst. Siehe die PHP Funktion fopen(): http://tinyurl.com/2jp2c9 Wenn du auf Reflexionen verzichten kannst, dann kannst du die URL von den Bildern auch direkt angeben (also 'reflect.php?img=' weglassen)...
Hallo, ist es möglich ein "externes" Bild von einem anderen Server in die reflect.php einzubinden? Funktioniert bei mir leider nicht.. Ein "lokales" jedoch schon..
Steven Pothoven made some nice (handy) code improvements on ImageFlow. Check it out: http://tinyurl.com/32kejp
I'd agree with that. But I'd also add my name along with Denis's to the wishlist for the lightbox effect happening only for the centre image :)
@ Frog: No idea! And to be honest: Why would you do that anyway? ImageFlow has been developed to navigate through images and all the lightbox etc. effects interrupt that smooth handling. So if you don't want to use ImageFlow for navigation and Lytebox instead, why would you need ImageFlow? Stick to one. Both have their pros and cons, but if you mix them together it's getting ugly...
@ myself: http://www.dolem.com/lytebox/
@ Frog: What is "lytebox"?
I have made a ImageFlow version with lytebox, but you can't use the next and back buttons in lytebox. How can i make that?
@ Kinshuk: Can you post a link on your implementation? Otherwise I don't really know what you mean...
I am trying to use imageflow on my page where I have a lot many other images too. The problem is that the other images on my site gets dislocated when I use imageflow. Have you seen te similar problem earlier?
@seba @ finn ist das jetzt schlimm? habe genau das selbe Problem. :-( sobald die img Klasse mit Position definiert wird springt sie raus? Hattet ihr eine Lösung? Liebe Grüße
Ja, da hast du recht ;)
@ seba: Lass mich raten - Table layout? ;D
http://img211.imageshack.us/im g211/9823/asdgf8.jpg Hab hier mal einen Screenshot gepostet
Das hier ist die CSS ------------------------------ http://www.nopaste.org/p/aNLVU uvFob Das hier die PHP ------------------------------ - http://www.nopaste.org/p/arQnH aQ0U So die includes etc. sind richtig und Funzen tut soweit auch alles. Den "img" befehl musste ich in der css auskommentiren da er die komplette Website Nach "oben" gezogen hat .
Thanks to Wynn there now is a ASP.NET version of the reflect.php available: http://tinyurl.com/2vl922
@ Denis: Yeah. The Problem is, that through the a href (which is needed by the lightbox2) already uses the onclick handler. What you can try is setting the onclick handler of the a hrefs AFTER they have been processed by the lightbox JavaScript to something like NULL... Find it out by yourself ;D
Thanks ! I will try this asp version by tomorrow. About the lighbox2 effect, I saw than the picture open then if you click on left or right picture. Would not be better if the lightbox be linked only on the main picture at the center ? And the scrolling only if you click on a right or left picture.
@ Seba: Poste mal einen Link zu deiner Implementierung. Orientiere dich an der Demo...
So hab den Fehler Gefunden . Da ich den "img" befehl aus der css gestrichen habe funktionirte das ganze leider nicht mehr. Aber nun ist das "img" problem da das alle Bilder also die ganze Navigation etc. an der Browserdecke "klebt " :) .Gibt es da eine Lösung ??
@Finn: I was hoping to be able to fix the size of the images.
Hi ich muss erstmal ein Kompliment loswerden:" Das Imageflowscript ist super gelungen " Aber ich habe eine Frage unswar geht es bei mir die Falsche Axe entlang also es sollte schon so wagerecht laufen und nicht senkrecht. Wenn jemand eine Idee hatt wäre das cool.
@ Evan: Sure, I think of making everything optional! You can disable the reflections now by stripping the reflect.php?img= from the img src attribute and setting the conf_reflection_p = 0 ... Disabling automatic resizing is a hard one... That is hardcoded within ImageFlow. What exactly do you want instead?
Could the next version of ImageFlow support disabling reflections and automatic resizing?
Okay, this site now proudly offers you RSS Feeds of the Shoutbox and the Newsblog! Check it out: http://tinyurl.com/2cdllu
@ Denis: Yes, someone did that already and I'm waiting for him to mail me his ASP.NET version of the reflect.php... stay tuned, I will post it when I have it.
Excellent yor imageflow with lightbox2. Do you think that you will deliver a reflect script for ASP server instead of PHP server ? Thanks
Tadaaa: This Shoutbox has a RSS Feed! (finally ;D) Keep track of the discussion by simply using RSS: http://tinyurl.com/yp63xw
Hallo, nettes Tool das ImagFlow. Wollte es gerade in meine Seite einbauen. Es wird in ein dynamisches DIV mit Scriptaculous geladen. Dabei werden die Bilder aber nicht angezeigt. Scheint wohl noch ein Problem zu sein. Gibt es da schon eine Lösung?
thanks!
Hi, I tried "centered layout IE6 hack" But the round indicator goes out of white line to the left unless you click one of the picture in IE 7. Firefox does not have a problem. How can I fix it? Regards.
okay habe den fehler gefunden funk jetzt alles !!! sogar mit LightBox2. kann ich das ganze auch in mein wordpress blog einfügen
Thank you for your imageflow. It looks great! I try to delete some of div or paragraphs, but it gives error in IE7. Do you have any idea what is wrong?
@ Indy007: Schick mir nen Link zu deiner Implementierung...
Okay. It took me 30 minutes to make ImageFlow compatible with lightbox2 You can grab yourself a copy of that proof of concept: http://tinyurl.com/2jpbjn
Ja den flow effekt bekomme ich hin nur bei mir spiegeln sich die foto nicht.
@Indy007: Die Reflektionen werden automatisch via PHP erstellt! Lies die Doku ;D Und es gibt jetzt auch eine Installations-Anleitung: http://tinyurl.com/2xrs55
@ Ian: I have the same problem with the IIS. The only solution I found was to remove the Ugly but works. You can have a more sophisticated solution by detecting the browser type and only removing the DOCTYPE for IE.
wollte mal fragen wie ich die reflection erstellen kann ??? mit welchem programm habe über 100 fotos
@ nev & Denis: I know, this is just the first dirty hack... consider it as a proof of concept ;D I'll make a nice browsercompatible and downloadable version of it this weekend...
sorry - I mean "only when the user clicks on the frontmost image"
Superb your lightbox 2 but the pictures are not in the center of the box, on IE7.
Finn, that's great! except I think the best user flow for this is to have the lightbox effect happen only when the user the current frontmost image. Then it looks like you've got it nailed (apart from the lightbox css etc)
@Ignite: That's just in time. I am longing to put your ASP.NET reflection on my website. http://www.thaisingles.de
Okay. It is possible... I still work on the CSS, but you can have a look at the first dirty hack ;D Project page for ImageFlow 0.8 - Hacked version for Lightbox2 compatibility: http://tinyurl.com/2jpbjn
Sam - I wouldn't say it's worthless! If you can sort out portrait and landscape aspect-ratios together in your implementation, and if the reflections are big enough, it's as good as a gallery itself! But I agree - some lightbox effect onclick would give it that extra something. Still working on it..
@ Sam and nev: I will think about that one! propably this weekend I will release a hacked imageflow version, that ignores any a tags within the div container images and can therefore be used with thickbox and lightbox etc... If I get it ;D
ImageFlow in CMS contentpapst von sandoba.de integrieren. Shop-Artikel in Form einer "Cover Flow"-Galerie darstellen: http://tinyurl.com/29z7wv
, dass die Bilder einen a-tag bekommen können. (wurde abgeschnitten, offenbar wegen kleiner-als-Zeichen.
I also looked into the imageflow and lightroom rabithole - tried everything I could in combination with the thickbox. Imageflow is nice as it is, but without any chance to integrate it into an gallery of some sorts (being a lightbox) it's nearly worthless. Just opening the image in _parent isn't the solution, at least not for my purposes. ;) PLEASE Finn, schau's dir nochmal an, ob du nicht einen der Vorschläge hier aufgreifen kannst und Imageflow so umschreiben kannst, dass die Bilder einen
Hey bac - nice try! My brain melted over this one. Hmm. a donation or a bribe?!
I have also failed miserably to integrate a lightbox effect to ImageFlow. Thinking it might be the simplest method, I tried to two functions and call them both from focused image onClick event, so far no good... [I assume] It would be easier to integrate other scripts if the ImageFlow effect was applied via the ImageFlow images element rather than the actual image - this also has the added benefit of making the link to the image accessible! However from what I can work out changing the hook for the ImageFlow effects from the actual image to the images A tag would take a lot of effort rewriting much of the script???? Maybe a donation or two might help motivate Finn to take a look at it ;)
@ Ignite: Sure! I would like to add your ASP.NET version of the reflect.php on my site... Had a couple of requests concerning that already. I wrote you a mail...
hey, I developed a version of reflect.php in ASP.NET. want to post it on your site? blog@ignite180.com
The trouble i'm finding with adding Lightbox-type effects is, though they would probably look great, they all usually require a href link, but using that around the images breaks the effect - as Mike discovered below. Just trying to find a way around this.. if it's possible!
Rotkäppchen ohne Korb: http://tinyurl.com/2adng3
@ nev: Have you checked the ThickBox? http://jquery.com/demo/thickbo x/
Still looking... Anyone know a lightbox that works off the img tag using a rel?
@ Andrew: Thanks!
Just stopping by to compliment your work.
OK, I fixed the portrait ratio stuff in IE6.. now to slot in a lightbox effect hehe..
Got it going well now - except for some IE6/Win problems still (what a pile of **** is IE6!). Anyone having trouble in IE6/Win with images that are portrait aspect-ratio? They seem always to end up too tall, despite my efforts to keep them not so high.. One other thing, reflections generated by reflect.php take quite a while to load. I have a nice fast server, yet you have to wait quite a while with as few as 30-odd images. I think it would be too long a wait with, say, 50-100.. Trouble is, it makes life easier! What to do :D
Optimus Maximus keyboard ist eigentlich eine schon 20 Jahre alte Idee. Nachzulesen in der c't von 1986, Heft 1 - S.12: http://smiddi.verbrennung.org/ keyboard/
@ Matt: I can't figure it out at the moment... If you can handle C++ some JavaScript won't break your neck ;D
Thanks, Finn. Forgive me, though, it's been years since I've done programming, and that was C++. Anyway, I can not for the life of me figure out where to insert the opacity code...
This one made my day! http://tinyurl.com/ywwpjx
I realy like ImageFlow! One suggestion: you should implement some kind of lazy loading mechanism. If you have say 10 images you can show de ImageFlow and keep loading the rest of the images in the background. And if you have about 400 pictures, why load them all? Just load the next 20 or so images!
The class="caption_content" in 2 lines would be interessant, better than "alt" balise. The "fade" image into the background the further they are away from the center would be perfect.
@ Matt: Sure, why not. Take a look at: http://www.quirksmode.org/js/o pacity.html
Danke für das tolle imageflow. Hier ein Einsatz als Verkaufswidget: Beschreibung unter http://www.sitango.de/blog/ Hier das lebende Beispiel http://www.sitango.de/widgets/ test1.html
Is it easy to have the images "fade" into the background the further they are away from the center? That is, adjust their opacity depending on their position?
@ Birger: I also recommend XAMPP: http://www.apachefriends.org/d e/xampp.html
I made a script to make it more easy to use (at least for me...) I replaced the file index.html with my index.php ( http://pckart.se/ImageFlow_0.8 /index.php ) to make it take all images in the img folder. Now I do not have to hack the code when I replace a image.
If you want to have a webserver with php running in your local windows mashine, I can recommend uniform server: http://www.uniformserver.com/ It is a webserver in a folder (no installation needed) It´s super!
@ Benny: wenn du unbedingt eine JavaScript Bibliothek benötigst versuch es mal mit http://www.outcut.de/MooFlow/ ;D
Erstmal großes Lob, find ImageFlow ziemlich klasse! Nur eine Frage, hat jmd Erfahrung in Kombination mit mootools? Da geht es leider nicht mehr.
Ich habe eine kleine Installations Anleitung für ImageFlow geschrieben. Englische Übersetzung folgt... http://tinyurl.com/2xrs55
Hi everyone, I updated the FAQs! German version: http://tinyurl.com/3d2p8q and English version: http://tinyurl.com/2wph54 - Please take a look at those before you ask ;D
@ rencus: Thank you for the feedback! That are nice ideas. I still think about the best way to make sure, that the user knows, that the images are clickable... If I only had some time on my hands for rss... Currently translating the updated FAQ into english...
and: making this shoutbox rss-enabled would be worth-a-while :D
I've got two ideas how to improve code quality: *non-semantic divs (containing no pure data: loading, captions, scrollbar, slider) should be js-generated: whole script works only on js-enabled browsers, so on browsers with js disabled you just can't get to images: there is never-ending "Loading images" * pressing enter should fire the same event as click/dblclick: if I am able to navigate with my keyboard only why must I touch mouse to e.g. enlarge picture? And "clickable" images should be somehow highlighted to let users know if it's worth clicking/entering - border/outer glow/small image in bottomright or something: changing cursor is not enough when you navigate only with keyboard Best regards.
Hey there! In firefox3 b2, when i use the slider to view images i get a minor bug. After letting the mouse of the slider and then try to use the slider directly again, the mouse changes to "cannot-draganddrop-here" and when i release the mousebtn the slider folows the mouse around.. Could this be a bug only in the Firefox3 beta2? Otherwhise, nice work!
@ Matt: http://tinyurl.com/ysl3ex ;D
@ Hiz: Ja, das sollte gehen, dazu musst du die reflect.php umschreiben. Aber ich rate dir dringend davon ab, weil es dann jeder benutzen kann. Ich könnte z.B. dein Script dazu benutzen mir Bilder mit Reflektionen für meine Homepage zu generieren und so deinen Server auslasten...
@ Florian: Thanks for the info, very interesting! But you are not quite right with safari beeing the only Browser: Opera can do that too... and there is the same bug. Not always, but sometimes... strange! Would you be so kind and send me a mail with your workaround source. I would like to test it by myself and implement it in the next version (I will post your name in the Changelog ;D).
A little update on the safari3/OSX back button issue. I added a window.onunload function which destroys the javascript "document" object. This forces safari to rebuild the javascript on history.back. Other browsers are not affected by the function, because it just imitates a "normal" browser behavior. By using this funtion and clicking the back button Safari looses the ability to display the last state of the page (in this case, the last centered image), but afaik Safari was the only browser with this ability anyway...
Lange gesucht und endlich gefunden. ImageFlow ist einfach genial! Ich hätte nur gerne gewusst, ob es möglich ist, Bilder über eine komplette URL einzubinden. (Bsp.: reflect.php?img=http://subdoma in.url.com/30685p.jpg) Bei meinen bisherigen Versuchen wird leider kein Bld angezeigt, sondern der Inhalt aus dem alt-Attribut. 1000 Dank im Voraus! Gruß HIZ
Hi, einfach grandios. Um es in eigene Anwendungen zu integrieren, würde ich mich über eine kurze Info zur Konfiguration freuen (Größe des ImageFlow-Fensters, Farben, angezeigte Texte etc.). Im voraus schon mal Danke! Gruß Matt
Hmmm... I should really spend a minute on writing a tutorial and an up to date FAQ... ;D
@ Peter: http://tinyurl.com/3bewat
@ jaydub: Have a look at the FAQ #3 http://tinyurl.com/2wph54 If you need to call a function on a click event change line 166 and 252 in the imageflow.js to fit your needs... The URL shows null, because you have not set the longdesc attribute. . o O ( I should make that optional ;D )
Thanks for providing a fantastic image viewer! I'm trying to add a simple onclick (ondblclick) event, but all that displays is a 404 and the URL shows ".../null" (Ultimately I want to implement Highslide with this viewer.) Please take a peek at http://tinyurl.com/yrsczd
Hallo, die Applikation sieht wirklich toll aus; aber bei mir werden keine Bilder angezeigt, nur die Namen der Bilder. Die png-Bilder sind aber im korrekten Ordner abgelegt. Hab ich irgendetwas übersehen? Wenn ich die INdex.html vonm total Commander aus starte, meldet dieser beim Laden "File not found" und startet alles, wie oben beschrieben (Firefox 2.0.0.11). Ich würde die Sache gerne zum Laufen bringen und wäre für jede Unterstützung sehr dankbar. Beste Grüße; --Peter
Autoscroll wäre wirklich noch eine nette Erweiterung.
@ Birger: Currently not. But you should be able to implement that one within minutes... use the handle() function [handle(1) and handle(-1)] and a simple JavaScript timer function... Or you can motivate me doing it by a donation ;D
A nice tool, ImageFlow! Is it possible to make it autoscroll?
@ Ian: Sorry, I really can't help you without looking at your page running...
(but I need it to run at 1280*1024, which errors) :(
Still struggling with my errors, but think I've made some progress. I took the "reflect.php?img=" out but it made no difference so it put it back. THEN I wound my resolution down to 1024*768... ta da! it worked! So whatever causes the problem in IE is somehow resolution/size linked...
Lightbox just needs to have a rel="lightbox" in the url so any link with that included will open a lightbox. I want to be able to open a full size image from the imageflow image without leaving the page. I'm actually working on a Jalbum (jalbum.net) skin that might be based on imagflow. You can see my skins at jalbum.macosxsupport.com.
@Finn & nev: I'm also experiencing the safari3/OSX "TYPE_MISMATCH_ERR: DOM Exception 17" bug and narrowed it down to the safari "history" caching feature. If you turn that feature off (you can do that in the debug menu) everything is fine. I think your iframe workaround only causes safari to completly rebuild the page. Perhaps that's also possible with some kind of meta "no-caching" tags (stupid workaround, too...) ?!? The bug itself seems to be the gold-old "javascript wants to do something, which is not initialized properly"... We simply have to make safari rebuilding the whole javscript environment.. I'll try that tomoroow and keep you up-to-date. Call it a day...
@ Mike: Is lightbox a complex JavaScript? I would check its internals and look out for the method, how lightbox grabs the URLs and rewrite it, that it takes the URL from the longdesc attribute... BTW: What do you need lightbox for, when you can use ImageFlow at its full glory ;D
an " a href" type link ( the html didn't come thru on my last post)
What I actually need to do is have an link for each image. I'm trying to add a Lightbox effect and it needs a link but adding one breaks the imageflow. Sorry if I was unclear.
Mh, InFrames ist natürlich eine Möglichkeit, wenn auch eine leder sehr unsaubere... Mal sehn was ich da mache, danke für das schnelle feedback!
@ Christian Trick: 1: http://tinyurl.com/2nkkfj 2: Naja, man kann beliebig viele via IFrames implementieren. Eine andere Lösung gibts da momentan nicht wirklich...
Das Imageflow sagt mir wirklich sehr zu, tolle Arbeit! Ich habe 2 Fragen: 1. ist es möglich dass kleine Bilder nicht vergrößert werden? (Ich möchte nicht das das bild das in der Mitte angezeigt wird in irgendeiner Weise skaliert wird, daher dachte ich ich speichere einfach alle Bilder in einer kleinen Auflösung, doch leider skaliert Imageflow diese hoch. 2. Ist es möglich 2-3 Imageflows auf einer Seite einzusetzen? Wenn ja wie? Mit Freundlichen Grüßen, Christian
@ DonStiego: So soll es sein... Bitte ;D
Danke für den Link Finn,zentrieren funktioniert jetzt auch beim Internet Explorer.
I tested the ImageFlow browser compatibility: http://tinyurl.com/2mhqxw
@ Ian: Have you thought of checking your images? If the IE has a problem setting attributes via JavaScript to image objects there might be a problem with your images. 1st: Try using the images without the reflection by deleting "reflect.php?img=" in each img tag. 2nd: Try using different images.
Finn, I can't place my site in a public location at this time. This is very frustrating. It's almost perfect, but I have to get rid of these two errors. I've tried through firefox and there is no error shown at all, so it's clearly something IE-specific (of course!). Using different versions of IE, on different OSs with the completely default installation files unmodified I always get two invalid argument errors on two lines in the moveto function. The two lines erroring set the values for image.style.height and image.style.top. If I comment them out I get no errors (but a very ugly imageflow). Clearly this is something IE specific since FF shows no errors. However I do need to use IE for this, and I do need no errors. Has no one else seen this? Its the default fileset through IIS running on win2k3 in vmware with php5 and standard IE6 or IE7. If I look at other sites using imageflow using the same instances of IE I see no errors. Any ideas? anyone? Anything I can send you? Any crazy (polite) suggestions? I'm really keen to use this very cool bit of work, but am now totally stuck.
@ mike: Have a look at the HTML sourcecode of http://imageflow.finnrudolph.d e/
Having trouble entering a link in the longdesc attribute so that it works. I'm getting double images. Could you give me an example of how it should be formatted? Thanks!
Nein, bis jetzt noch nicht. Wenn du das übernehmen willst, dann helfe ich dir gerne dabei... Für Implementierungen habe ich momentan nicht die Zeit. Gibt wichtigeres im Leben ;D
Gibts das ImageFlow auch als Plugin für gängige Bildergalerien wie z.B. gallery2. Gruß Lucky
@ Denis: 1. Nope... I don't know a performant way how to transform images like your flash example in JavaScript... 2. Jepp, you can add any HTML into the alt tag, but make sure that you use HTML Entities. Have a look at the first caption: http://tinyurl.com/2lmeyt
@ Juke: Ich würd einfach in die erste Zeile der reflect.php folgende Zeile adden: $_GET['bgc'] = '#ffffff';
Ich habe mir das Tool installiert und frage mich, ob es eine Möglichkeit gibt, das Ganze auch auf weißem Hintergrund darzustellen. Dazu müsste man in der reflect.php am Gradienten für die Reflektion was ändern. Das kann man, so wie es in dieser Datei aussieht, sicherlich auch - die Frage ist nur wo? Ganz genau wo? Kann mir das jemand sagen?
Very handy: http://browsershots.org/
@ Timo: kannst du mir davon mal ein Screenshot schicken?
@ Sebastian: ImageFlow skaliert in Relation zur Breite des DIV Containers "imageflow". Wenn du eine fixed max width für die Bilder haben willst musst du einfach die richtige Breite des imageflow containers finden. Ein Beispiel (max. Kantenlänge 200px): http://tinyurl.com/2vogj7
1-/ Would it be possible to show the pictures like this flash demo ? http://www.webdesignerwall.com /demo/photoflip-gallery/ 2-/ Is it possible in Alt tag to show many information in several lines instead of only 1 line ?
If we have only a ASP server instead of a PHP server ; is the reflection would be possible ? Is someone would know how would be the code ?
ImageFlow ist toll! Läuft aber nur im IE6 sp1, nicht im IE 6.0.2900.2180.xpsp-sp2_gdr.070 227-2254 (grobe Darstellungsfehler). Kompatibilität also erst ab IE6sp1, nicht IE6.
Hallo! Geniale Sache, dieses ImageFlow. Gefällt mir echt gut. Das Teil war echt total leicht einzubauen, Gratulation dazu. :) Was ich mir noch wünschen würde, wäre folgendes: Eine maximale Bild-Höhe und/oder -Breite. Es ist so, dass die Vorschaubilder ja manchmal eine bestimmte Größe haben, und hochskaliert schaut das dann blöd aus ;) Ich würde folgendes bevorzugen, nämlich eine allgemeine maximale Höhe und Breite.
@ Phil: Es gibt jemanden, der derzeit an einer Flickr Schnittstelle arbeitet, wenn das fertig ist poste ich hier einen link...
@ DonStiego: Guck dir mal das an für ImageFlow im zentrierten div mit IE6 Kompatibilität: http://tinyurl.com/2lmeyt
super ding! das jetzt als wordpress-plugin oder mit flickr-fotos benutzbar, und ich wäre glücklich :D
Hallo Wirklich super Sache dein ImageFlow. War so frei und hab es in meine Seite eingebaut, leider happerts noch ein wenig mit dem zentrieren beim IE. Viele Grüße DonStiego
Coole Sache das mit dem Image Flow :-)!
@ Bernd: You need a server running PHP with a GD library to generate the reflections. If you currently don't have one edit the index.html and delete "reflect.php?img=" in each img tag... That will run imageflow without the reflections.
Hi Finn, really nice work! I have a problem, when downloading, extracting the .rar-File of ImageFlow and displaying the "index.html" file in FireFox, I see the white slider, but the images "img001.png", "img002.png" do not appear. Instead only the image's filenames are sliding around on the very top of the browser window. With IE6.0 I get javascript errors. What am I doing wrong? Cheers, Bernd
@ Finn, tried the transparent image without success. Although, I did add script to remove the ability to select within a div. That worked, but slowed down the scroll. Any other suggestions?
@ Chris: Okay... I will think about it: http://www.rssboard.org/rss-sp ecification
@ udi: Yeah... I currently think about a mod_rewrite ;D Please use http://www.finnrudolph.de for my website an http://imageflow.finnrudolph.d e for the imageflow project site.
@ Jason: I know... perhaps one could fix that with a transparent image behind the slider?
Hi, could you please implement a RSS-feed link to your page? I think a lot of people would follow your news with a RSS feed-reader. Thanks
Great application. For some reason the url for this page is an IP url (http://194.95.111.244/~countz ero/). is there a host name I can use to recommend this? - udi
I know IE Sucks, but a lot of people use it. Within IE, I noticed when you drag it highlights the text. Also, it only start and stop scroll when you mouse up. Great work. I love it. NOTE: IE 7.0
very nice
@ Ian: No clues until you upload the stuff to a public place an post me a link ;D FireFox should display the same error like IE, but has way more useful error messages...
(BTW - it's IE, not FF)
OK, there are TWO errors returned. One each for the following two lines in imageflow.js image.style.height = new_img_h + 'px'; image.style.top = new_img_top + 'px'; It looks as if the problem is with new_img_h, since that is used in caluclating new_img_top a bit earlier. New_img_h comes from max_height. At that point I lose it. Does this give any clues?
@ hello: Hi, How are you? ;D
@ Ian: Use the error console of FireFox to get more details. If I don't see your code I can only guess...
It's not publically accessible yet, but when it is, I will. However, guess what...? I get a script error on my page now. Invalid Argument, line 141, character 4. Any ideas?
@ Ian: Great, problem solved without any help ;D Can you drop a link in this Shoutbox, to show off what you did with it?
cancel that! I fixed it. It was a fault with my PHP installation looking in the wrong place for the php ini file. Now to put some pictures in place :)
Help! I'm a bit of a newbie to this, and am really struggling just to get it going. What am I missing? I've downloaded and extracted the zip file, can see the layout in my browser, and can navigate back and forth. Great. But I have no images, just image placeholders. OK, then I noticed it uses php, so I've installed php, but that has no effect. All now on a webserver (iis), no difference. When I browser to the reflect.php file I get the following - which may not be relevant... "Warning: dl() [function.dl]: Not supported in multithreaded Web servers - use extension=gd.so in your php.ini in C:Inetpubwwwrootimageflo wreflect.php on line 43 You are missing the GD extension for PHP, sorry but I cannot continue." I made the mod to the php.ini file, buit thaqt made no difference. I just feels like I've missed something obvious here. Any guidance ? All help appreciated.
Hm - OK, an expression? why not? will check it out. thanks it's looking better!
Grab yourself a brand new transparency creating reflect.php here: http://tinyurl.com/yseu2z
Option for the next ImageFlow version - real PHP generated transparency. Check the Demo hosted by Rubin: http://tinyurl.com/28r67b
@ nev: This one is just for you (before you get mad ;D): http://tinyurl.com/2lmeyt
I put that there in an attempt to solve the IE6/Win bug by adding some HasLayout. But now I've taken it away, and it still doesn't work.
nev: FireFox and IE don't like your zoom attribute in the CSS! Have a look at: http://tinyurl.com/272zu2
I can't see how this can be implemented so that it will render properly in IE6/Win. I hate IE6 too, but most people use it :) I tried a simple centred design here: http://tinyurl.com/2orvjm ..but in IE6/Win the images spill out from the containing box, to the left. I looked at your implementation at: http://tinyurl.com/34xarh ..but I couldn't see anything in the css that would rectify the centred design example. Anyone know the answer?
i think I can use this some time ;D http://tinyurl.com/24ke4h
@ Chriss: Ich mag ehrliche Menschen ;D Antwort: Keine Ahnung! Ich vermute, dass es einfache sein wird diesen Effekt, dass ein Bild größer gezoomt wird einfacher selber zu implementieren ist, als die gesamte Highslide Bibliothek damit zu kombinieren... Ich bin auf deine Lösung gespannt ;D Hast du schonmal im Highslide Forum angefragt?
Inspiring ImageFlow implementation (MP3-Player, Temporary location have a fast look ;D): http://tinyurl.com/2xt4dd
@ Rubin C.: I can give it a try, but at the moment I'm kind of busy with other important stuff. This project seems to become a real time killer... If you need this one right now motivate me with a donation ;D or ask someone who knows PHP or even better try it by yourself. It's nothing special and if you follow my given hints it should work...
Hey Finn, Can you show how to add the hack to the reflect v3 in order to make the images transparent for those who want to use a nice photographic background effect. With v.8 it's not possible with the current configuration. Thanks
that works great looks cool! thanks finn
hiho! erstmal: sehr sehr schönes ding des du da gezaubert hast! hätte nie gedacht, dass sowas ohne flash möglich ist! so, genug geschleimt, meine frage: wie kann man highslide in diese galerie einbinden? sprich, was muss man wo in deinem script verändern, damit bei einem klick auf den angezeigten thumb sich das foto als großformat via highslide öffnet? ENGLISH: (...) How can "Highslide" be integrated in finn`s gallery?
@ Penny: You have to add the whole url into the alt tag of the image. But you have to convert the HTML tags. Have a look at the alt tags of this imageflow implementation: http://tinyurl.com/37xbpf
@ Kaiser: Can you give me a link? Anything else would be guessing...
@ Co007: Hmmm also unhübsch, aber einfach. Ich würd einfach in die erste Zeile der reflect.php folgende Zeile adden: $_GET['bgc'] = '#ffffff';
Can anyone show me how to add a link to the caption? Thanks!
Hi Finn, erstmal: sehr schöne Sache. Läuft auch wunderbar :-) Nur die Anpassung der Hintergrundfarbe passt bei mir nur, wenn ich sie bei jedem Aufruf der reflection.php als &bgc=ffffff mitgebe, was allerdings gleich vom Tidy als nicht valides HTML angemosert wird. Setze ich die RGB-Werte in der *.php beide male auf $red = 255; $green = 255; $blue = 255; ändert dies nix. Woran liegt das - habe ich noch eine Stelle übersehen, oder kann ich die HG-Farbe nur als $_GET-Parameter mitgeben? Sorry für diese Basisfrage - aber meine PHP-Kenntnisse sind inzwischen komplett verschütt' gegangen. Ein schönes neues Jahr Corinna
i have a strange problem, on load the images are not visible on the slide bar but when i click on one of the images the image loads successfully on the new page. The gd2.dll is enabled on Apache and im using wamp5 1.7.4
Sorry - new URL: http://tinyurl.com/2p2gvl ;)
Ah thanks - I see the amendment now :) In my implementation a new window is necessary.. maybe will try http://tinyurl.com/hjsyl Cheers! (Danke!)
@ nev: That has been changed in version 0.8. The documentation has been updated. Check the third FAQ. I don't recommend opening stuff in a new window. That will break the link chain and the user can't go back using the back arrow of his browser... And I don't know how to achieve a target="_blank" in JavaScript ;D
Could someone give me an example of how to use the ondblclick="document.location ='URL'"? It's not working for me and I'm probably coding it wrongly. Also - is it possible to open the URL in a new window? many thanks!
@Finn The hack gets rid of the transparent reflections.
Update to the bug I found when using Safari3/MacOSX. Most unusual! By selectively deleting your code I found that the bug only occurred when I removed your Google tracking script from the bottom of the page! I know this code has nothing to do with ImageFlow (you even state this explicitly before the tracker script), but deleting this Google Analytics code does indeed cause Safari3/MacOSX to show the bug. I then realised that I had come this situation before in Safari, when the removal of some Google Analytics script code stopped a different javascript slideshow effect from working properly. The solution then was to insert a dummy iframe where the Google Analytics code was. So I tried this with the ImageFlow example here, and bingo! the bug disappears! See here for the story: http://www.dynamicdrive.com/fo rums/showthread.php?t=8577 So, instead of the Google Analytics code I inserted this: ...and the bug has gone! I know all this sounds weird, but it's definitely the cause of the bug for ImageFlow in Safari3/MacOSX. I tried various dummy divs or css bits and pieces, but only the iframe works! I have no idea why the insertion of a dummy iframe like this makes the bug disappear. However perhaps it would be better to insert some "dummy" javascript code. I think it needs the "src=" part somewhere in the dummy code. What is the smallest and most harmless dummy js code with "src=" one could insert, that wouldn't affect anything else?
Wall-E Trailer in HD: http://tinyurl.com/2fs4xc
@ Rubin: Yeah... I hacked the original reflect.php to create an image including the reflection. The original versions just create a reflection. Check the file, that comes with imageflow for the comment "HACK" and see how I rewrote the stuff... Should work in the same way for the 3rd version... BTW: Happy new year everybody ;D
Hey, I was wondering if you csn help me out with making the reflections to become transparent. I tried replace the reflect.php with the 3rd version, but for some reason the reflection is the only thing that showed up on the page. I was just wondering if you can me out with this. rubin.chervak gmail com