Jump to content

Search the Community

Showing results for tags 'images'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • W3Schools
    • General
    • Suggestions
    • Critiques
  • HTML Forums
    • HTML/XHTML
    • CSS
  • Browser Scripting
    • JavaScript
    • VBScript
  • Server Scripting
    • Web Servers
    • Version Control
    • SQL
    • ASP
    • PHP
    • .NET
    • ColdFusion
    • Java/JSP/J2EE
    • CGI
  • XML Forums
    • XML
    • XSLT/XSL-FO
    • Schema
    • Web Services
  • Multimedia
    • Multimedia
    • FLASH

Calendars

  • Community Calendar

Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests


Languages

Found 39 results

  1. Trying to Create Image Grid w/ Hover

    The page in question is Here I'm going to have a dozen or so images that I want lined up grid-style. They'll all be sized the same. But, I also want to have the hover overlay that's currently there. CSS is currently: <!-- THUMBNAIL --> <style> .container { position: relative; width: 50% } .image { display: block; margin: 3px; width: 50%; height: auto; } .overlay { position: absolute; top: 0; bottom: 0; left: 3px; right: 0; height: 100%; width: 50%; opacity: 0; transition: .5s ease; background-color: #000000; } .container:hover .overlay { opacity: 1; } .text { color: white; font-size: 20px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } </style> HTML for each image is: <div class="container"> <a href="../images/thankyounotes/football_equipment.jpg" data-lightbox="kidswehelp" data-title=""><img id="football" src="../images/thankyounotes/football_equipment.jpg" class="image"></a> <div class="overlay"> <div class="text">Testing This</div> </div> </div> Thoughts?
  2. Movable Zoomed Image without Java?

    I am in the process of learning CSS and creating a stand alone web page for a kiosk at our school district. The site houses senior class composite photos (so one large photo with all the students in the class in it). I am currently inserting the full size .jpg in the page with an img tag and then I am using enlarge on hover to make the photo bigger. Once it enlarges it, it is static though, you can only see the part of the photo that fits on the screen. I need the users to be able to move the enlarged photo around (via touchscreen) so they can find the person they are looking for. Is this possible without having to use javascript? Thanks,
  3. Hi all, In one website, I read the following note: "You should also think about storing files locations on disk. Using MySQL for storing images is thought to be Bad Idea™. Handling SQL table with big data like images can be problematic." Do you agree? If not, why? What is the best practice in storing and displaying on a website a big number of images?
  4. W3 css and z index syntax

    To the developers of W3.CSS thank you so much for creating a platform that in my opinion, uses less code to create a web responsive site with bells and whistles built in. I had hand coded a webpage template, but now that Google won't rank your site properly unless it is responsive, thus my template goes by the way of the 8-track. W3 provided the coding to make sites responsive, but that was still more time that I didn't have. Then, came W3.css now I can replicate my template using W3css, THANK YOU! my original template used layers via z index, placement via <div>, and in page css. My query is what is the proper syntax and use for z index within W3.css and within the container, and can multiple layers be used with a container? also can background images be used within W3.css? I see you have colors, what about images? also can the rollover feature within W3.css be used with custom images, and for non menu? based on replies, I will update your free template accordingly. Thanks once again
  5. None of my images are appearing

    When I code css and html none of my images are showing up when I test the website. I have done everything I can do. I tried a different software to code on, I have tried to use different methods of getting the image to appear. Even created a blank site and just added a image but nothing would show up. I would be really grateful if you could help me as it is really holding me back from creating websites.
  6. Changing Images on a Templated Page.

    I've a beginner's problem maybe someone can help with. Imagine a game simulating a sporting event (baseball, boxing, football, &c.). The games, themselves, are divided into time periods -- innings, rounds, quarters, &c. -- and one cannot know ahead of time how many periods actually will be played. So, for example, baseball is a nine-inning game -- unless there is rain or the need for extra innings if a tie; boxing is so many rounds -- unless there is a knockout or other fight-ending incident. The simulation addresses this within the game via a template -- the template describes with html what the presentation of one period -- inning, round, quarter, &c. -- will look like, and the simulation then simply calls the template for however many periods it needs to complete the contest. My problem (we'll use boxing hereafter) is that I want to install a different image (a round-card girl with card showing the correct round number) at the beginning of each round. My thinking so far is to create an array, var cardgirls=new Array(), with each of 15 girls occupying a slot in the array, cardgirls[0].src=../../images/RCG1.png, &c.; body onload = "Cardgirl(cardgirl1, cardgirls)"; &c. The difficulty is as follows: I can call for a specific card girl (one for all the rounds) by using <td id=img><img src = "../../images/RCG1.png, and the first card girl then will appear atop each round. HOWEVER, if I try to substitute a javascript function for the image source (to change the src code and get a different image) -- document.getElementById("cardgirl1).src=cardgirls[k].src (referring back to the array); body onload = "Cardgirl(cardgirl1, cardgirls);"...<td id="img"><img id = "cardgirl1">, &c. -- I can get the images to cycle in order, but they only appear for the first round (NO images appear for rounds 2 through end, only the alt, "Cardgirl"). For clarity, let me put it another way: The game is loading the "rounds" template ("innings" template -- whatever) for every round the game calls for and using an anchor tag to distinguish them [name=$$No.$$, so that each "round" template has "name=1; name=2; name=3, &c.]. If I use a general source for ONE of the images, img src="../../images/RCG1.png", that image will appear above ALL the rounds; BUT, if I call a javascript cycle function, the template tries to cycle ALL of the photos in the first round and installs NONE of them in rounds two to end, which remain blank save for the alt unless I also install a default image [src=../../images/RCG16.png, &c.]. I gather that, somehow, I need to link the image placement -- one per use of the template -- with the anchor ID, but so far my efforts to do that have not met with success. Nor was I successful when I relocated the javascript function from the general head to the end of the "rounds" template (on the assumption that, each time the template was used, it would call anew the cycle function). Anyone have any idea what I'm doing wrong? The relocation idea did get me the proper number of cycles, e.g., 7 for 7 rounds, but that just caused RCG1 to be the girl with card, Round 8, instead of Round 1 or Round 12 (what appears when the function is left in the head). Relocating does not move the image to the correct round.
  7. It seems like I have been trying to display HTML img images and not very sure of the proper syntax. "HOW TO MAKE IMAGE NOT A BACKGROUND IMAGE BUT A PHOTO FOCAL POINT" "PROBLEM IS HOW TO PROPERLY INSERT A IMAGE. WHAT IS THE BEST WAY. AND WHERE TO ADD ATTRIBUTES OF THE FILE.", there must be several ways some tend to overlap and Is that ok good or bad? seems that I have to enter the style in HTML file after the img for it to take? I have been getting mixed results over some times, It seems to me that there is many ways to do everything. there is different way to achieve images in html I think I get confused because of css and the image-position and various selectors,like img or is it better to have it in a div element. or CSS having a URL to display the image like this |img { background-image: url=("")? What is the best way to have elements that are active images. ** what is the most universal excepted and accurately displayed method of sizeing images??** ---≥ example (size of width="10"; or width:10; or width="10px, or width:10px; or width=10% or ? what is the always excepted method? I keep on refferring to tutorials and refferences and I get different methods of HTML <img> and I cannot seem to get the most common and most workable what I would call the "best way to do this". Please if you will help? thankyou
  8. Hello, I'm attempting to re-create this Wix page - http://gtnphotography.wix.com/collectivecp#!new-equipment/c10au -in WP using the genesis theme. However, I'm having issues with spacing and alignment. Here's the code I have: <style> div.container{ position: relative; } p { text-align: center; margin-bottom: 60px; } div.container img{ position: absolute; top: -30px; left: -10px; right: -10px; } </style> <div class="container"> <img src="http://www.collectivecp.com/wp-content/uploads/2015/07/Red-One-e1436565960605.png" /> <img src="http://www.collectivecp.com/wp-content/uploads/2015/07/C100.png" /> <img src="http://www.collectivecp.com/wp-content/uploads/2015/07/Titla.png" /> <img src="http://www.collectivecp.com/wp-content/uploads/2015/07/Tilta-2.png" /> <img src="http://www.collectivecp.com/wp-content/uploads/2015/07/24-105mm.png" /> <img src="http://www.collectivecp.com/wp-content/uploads/2015/07/Rokinon-14mm.png" /> <img src="http://www.collectivecp.com/wp-content/uploads/2015/07/Fostex.png" /> <img src="http://www.collectivecp.com/wp-content/uploads/2015/07/Windshield.png" /> <img src="http://www.collectivecp.com/wp-content/uploads/2015/07/Wireless-Mics.png" /> <img src="http://www.collectivecp.com/wp-content/uploads/2015/07/Tascam.png" /> <img src="http://www.collectivecp.com/wp-content/uploads/2015/07/Fluorescent-Banks.png" /> <img src="http://www.collectivecp.com/wp-content/uploads/2015/07/Tungsten-Fresnels.png" /> <img src="http://www.collectivecp.com/wp-content/uploads/2015/07/Green-Screen.png" /> <img src="http://www.collectivecp.com/wp-content/uploads/2015/07/Client-Monitor.png" /> </div> Any help would be great. Thanks, Kelsey
  9. Hi again, thanks for some respond in past question really feel helpfull to discuss here. let me describe my problem i set images in front end for original 383 px * 533px but then realize that my client has photo 2024px * 2559px, succesfuly make it responsive but not good looking sprawl but the point is really near with responsive, here is my old css for 383 px * 533px /*large desktop*/.img-header { height:auto; width:250px; top: 0px; position: absolute;}/*landscape tablet*/.img-header { height: 240px; width:180px; top: 10px; position: absolute;}/*Potrait tablet*/.img-header { height: 210px; width:160px; top: 20px; position: absolute;}/*landscape phone*/.img-header { height: 200px; width:160px; top: 10px; position: absolute;}/*portrait phone*/.img-header { height: 130px; width:110px; left:0px; margin-top:-20px; margin-bottom:10px; position: absolute;} so any idea to make this images to responsive with original size from my client, what should i use for keep responsive used % or px, any link or explanation will be apreciate, Thanks Freddy
  10. I have a weather station which uploads jpg images to my web site each 5 minutes. I need to refresh my web page to show these images. Last year the refresh instruction in html used to work fairly well on PC but not on Apple. This year the page updates but not the images. www.lanzcam.com/windsurfing/weather.html See www.lanzcam.com/windsurfing/weather6.html for a simplified example I would prefer an automatic reload but even a reload button does not reload images weather6.html
  11. Putting a timer on slides

    Hi everyone, Thank you for letting me be here. This is my first posting. I am looking for some help with this slider I have on a website. It is working ok so far, except I can't seem to figure out a way to put a timer on the slides so that they would switch every few seconds. How do you guys think I should do this? Here is the code HTML: <div class="slider"><ul class="slides"> <input type="radio" name="radio-btn" id="img-1" checked /> <li class="slide-container"> <div class="slide"> <a href="/HR-Diploma-exda.php"><img src="/images/Slider-HRM.jpg" alt="Certified Human Resources Professional Executive Diploma"/></a></div> <div class="nav"> <label for="img-2" class="prev">‹</label> <label for="img-2" class="next">›</label> </div> </li> <input type="radio" name="radio-btn" id="img-2" /> <li class="slide-container"> <div class="slide"> <img src="/images/Slider-ILC.jpg" /> </div> <div class="nav"> <label for="img-1" class="prev">‹</label> <label for="img-1" class="next">›</label> </div> </li></ul></div> CSS: .slider{ margin-top:15px; margin-bottom:15px; margin-left:auto; margin-right:auto; padding-left:21px; width:880px; height:338px; overflow:hidden; border:0px solid; position:relative;}.slides { padding: 0; width: 880px; height: 338px; display: block; margin: 0 auto; position: relative;}.slides * { user-select: none; -ms-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -webkit-touch-callout: none;}.slides input { display: none; }.slide-container { display: block; }.slide { top: 0; opacity: 0; width: 880px; height: 338px; display: block; position: absolute; transform: scale(0); transition: all 0.2s ease-in-out;}.slide img { width: 100%; height: 100%;}.nav label { width: 100px; height: 30%; display: none; position: absolute; top: 118px; opacity: 0.2; z-index: 9; cursor: pointer; transition: opacity .2s; color: #FFF; font-size: 100pt; text-align: center; line-height: 85px; font-family: "Varela Round", sans-serif; background-color: rgba(255, 255, 255, .3); text-shadow: 0px 0px 15px rgb(119, 119, 119);}.slide:hover + .nav label { opacity: 0.5; }.nav label:hover { opacity: 1; }.nav .next { right: 0; }input:checked + .slide-container .slide { opacity: 1; transform: scale(1); transition: opacity 1s ease-in-out;}input:checked + .slide-container .nav label { display: block; }.nav-dots { width: 100%; bottom: 9px; height: 11px; display: block; position: absolute; text-align: center;}.nav-dots .nav-dot { top: -5px; width: 11px; height: 11px; margin: 0 4px; position: relative; border-radius: 100%; display: inline-block; background-color: rgba(0, 0, 0, 0.6);}.nav-dots .nav-dot:hover { cursor: pointer; background-color: rgba(0, 0, 0, 0.8);}input#img-1:checked ~ .nav-dots label#img-dot-1,input#img-2:checked ~ .nav-dots label#img-dot-2,input#img-3:checked ~ .nav-dots label#img-dot-3,input#img-4:checked ~ .nav-dots label#img-dot-4,input#img-5:checked ~ .nav-dots label#img-dot-5,input#img-6:checked ~ .nav-dots label#img-dot-6 { background: rgba(0, 0, 0, 0.8);}
  12. Random Links

    Hey so I am creating just a fun program where you can mix and match different tops, pants, and shoes. When you click an arrow button it changes the top, pants, or shoes. My code is not work. Please help, I think the problem is the way the link are placed. Please help. Here is my html: <!DOCTYPE html><html><head> <link rel='stylesheet' href='style.css'/> <script src='script.js'></script></head><body> <div class = "top"><div id = "randomtop"></div></div> <div id = "topright" onclick="toprightfnc()"><img class = "imgright" src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAALMAAAEaCAMAAABtrpZTAAAAM1BMVEX///+/v7+8vLzd3d3b29vBwcHs7OzMzMz7+/vX19fr6+vOzs709PTExMTg4ODn5+f29vaQxP3sAAAC50lEQVR4nO3d227iQBCE4eCEZMkCyfs/7bKKUAz4MB5Puqviv665+DTqLkuW8Dw9FeR8LvmVVM5d54Y+d7udGfr5QjZDf5Gt0FeyEfqbbIPuk03Qt2QL9D3ZAP1IlkcPkcXRw2Rp9BhZGD1OvqCfs3WDmSKLoqfJkug5siD6ZZYsh54/ZTl0GVkKXUoWQpfMshh6CVkEvYwsgV5KFkAvJ6eja8jJ6DpyKrqWnIiuJ6eh15CT0OvIF/SLHTkBvZ4cjm5BDka3IceiPxqZQYMGDboWfXBEW540aNCgq/PuWHmgQYMGDRo0aNCgQYPeGPrVEf3eyAx6LpbjARo0aAV0I7Mp+q8jmpkGDRp0Hdqy8kCDFkFbLiJo0OM5NjLTHqBBr8jRsj1AR6EbmUHPoveG6FdHtOd4gAY9gebhEoW2rDzQoCfQjcygQcugLRcRtB36zRFNe4CeQAfO9KcjeuPtARq0BtqyPUCHoR1n2nIRPdEnQ/TZ71XvRyPxbrc/RpFbnTLkGPIn5ACy4WAYkg0HAzJkyJCLc/IjG54yZMiQ08iGJQf5V5GbvS2KWz/IkH+Y7Ld+HWTIg4EcQd7/gQz5Md3JkGy3fpAhD8dv/QxLzpBs2cuGZLvGgDyR8kuRZ8lRs9yMHPcoaUcO6+UtDwZkyJAhQ1YjB4k3fsp+5DfIAWTDwQgjt7rg25McJN42OawxIEOGfE+mlyEPksP+Crrp9YM8ngNkK3JYyUH2Ioc9Sja9fpAh/xpykBgy5B8nG64f5PG0ugo9kNwKHfl9qEboYHILdDh5/f3tCeS16BTyuvGI/AjvTerv5ksj1590Irn2pJNmeQ06mVyDTicvv5tPgLy0pyXIy9CpjdFP+UzLkMvRQuRStBS5DC1GLkGLNEY/cz0tSJ5DS5Kn0XKzfM04WpY8vojC5DG0NHkYLU4eQsuTH9EG5Pv2sCDfok3IfbQN+RttRL6irchft9Wakf+j7cgX9CFb0M8/kH9frqpfpFQAAAAASUVORK5CYII="></img></div> <div id = "topleft"><img class = "imgleft" src = "https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcR1pyUMwdx_XBdS_318Mi-l39JKwwmrTJ6onBiVNM-WpyEul9Er"></img></div> <div class = "moretop"></div> <div class = "pants"></div> <div id = "pantsright"><img class = "imgright" src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAALMAAAEaCAMAAABtrpZTAAAAM1BMVEX///+/v7+8vLzd3d3b29vBwcHs7OzMzMz7+/vX19fr6+vOzs709PTExMTg4ODn5+f29vaQxP3sAAAC50lEQVR4nO3d227iQBCE4eCEZMkCyfs/7bKKUAz4MB5Puqviv665+DTqLkuW8Dw9FeR8LvmVVM5d54Y+d7udGfr5QjZDf5Gt0FeyEfqbbIPuk03Qt2QL9D3ZAP1IlkcPkcXRw2Rp9BhZGD1OvqCfs3WDmSKLoqfJkug5siD6ZZYsh54/ZTl0GVkKXUoWQpfMshh6CVkEvYwsgV5KFkAvJ6eja8jJ6DpyKrqWnIiuJ6eh15CT0OvIF/SLHTkBvZ4cjm5BDka3IceiPxqZQYMGDboWfXBEW540aNCgq/PuWHmgQYMGDRo0aNCgQYPeGPrVEf3eyAx6LpbjARo0aAV0I7Mp+q8jmpkGDRp0Hdqy8kCDFkFbLiJo0OM5NjLTHqBBr8jRsj1AR6EbmUHPoveG6FdHtOd4gAY9gebhEoW2rDzQoCfQjcygQcugLRcRtB36zRFNe4CeQAfO9KcjeuPtARq0BtqyPUCHoR1n2nIRPdEnQ/TZ71XvRyPxbrc/RpFbnTLkGPIn5ACy4WAYkg0HAzJkyJCLc/IjG54yZMiQ08iGJQf5V5GbvS2KWz/IkH+Y7Ld+HWTIg4EcQd7/gQz5Md3JkGy3fpAhD8dv/QxLzpBs2cuGZLvGgDyR8kuRZ8lRs9yMHPcoaUcO6+UtDwZkyJAhQ1YjB4k3fsp+5DfIAWTDwQgjt7rg25McJN42OawxIEOGfE+mlyEPksP+Crrp9YM8ngNkK3JYyUH2Ioc9Sja9fpAh/xpykBgy5B8nG64f5PG0ugo9kNwKHfl9qEboYHILdDh5/f3tCeS16BTyuvGI/AjvTerv5ksj1590Irn2pJNmeQ06mVyDTicvv5tPgLy0pyXIy9CpjdFP+UzLkMvRQuRStBS5DC1GLkGLNEY/cz0tSJ5DS5Kn0XKzfM04WpY8vojC5DG0NHkYLU4eQsuTH9EG5Pv2sCDfok3IfbQN+RttRL6irchft9Wakf+j7cgX9CFb0M8/kH9frqpfpFQAAAAASUVORK5CYII="></img></div> <div id = "pantsleft"><img class = "imgleft" src = "https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcR1pyUMwdx_XBdS_318Mi-l39JKwwmrTJ6onBiVNM-WpyEul9Er"></img></div> <div class = "morepants"></div> <div class = "shoes"></div> <div id = "shoesright"><img class = "imgright" src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAALMAAAEaCAMAAABtrpZTAAAAM1BMVEX///+/v7+8vLzd3d3b29vBwcHs7OzMzMz7+/vX19fr6+vOzs709PTExMTg4ODn5+f29vaQxP3sAAAC50lEQVR4nO3d227iQBCE4eCEZMkCyfs/7bKKUAz4MB5Puqviv665+DTqLkuW8Dw9FeR8LvmVVM5d54Y+d7udGfr5QjZDf5Gt0FeyEfqbbIPuk03Qt2QL9D3ZAP1IlkcPkcXRw2Rp9BhZGD1OvqCfs3WDmSKLoqfJkug5siD6ZZYsh54/ZTl0GVkKXUoWQpfMshh6CVkEvYwsgV5KFkAvJ6eja8jJ6DpyKrqWnIiuJ6eh15CT0OvIF/SLHTkBvZ4cjm5BDka3IceiPxqZQYMGDboWfXBEW540aNCgq/PuWHmgQYMGDRo0aNCgQYPeGPrVEf3eyAx6LpbjARo0aAV0I7Mp+q8jmpkGDRp0Hdqy8kCDFkFbLiJo0OM5NjLTHqBBr8jRsj1AR6EbmUHPoveG6FdHtOd4gAY9gebhEoW2rDzQoCfQjcygQcugLRcRtB36zRFNe4CeQAfO9KcjeuPtARq0BtqyPUCHoR1n2nIRPdEnQ/TZ71XvRyPxbrc/RpFbnTLkGPIn5ACy4WAYkg0HAzJkyJCLc/IjG54yZMiQ08iGJQf5V5GbvS2KWz/IkH+Y7Ld+HWTIg4EcQd7/gQz5Md3JkGy3fpAhD8dv/QxLzpBs2cuGZLvGgDyR8kuRZ8lRs9yMHPcoaUcO6+UtDwZkyJAhQ1YjB4k3fsp+5DfIAWTDwQgjt7rg25McJN42OawxIEOGfE+mlyEPksP+Crrp9YM8ngNkK3JYyUH2Ioc9Sja9fpAh/xpykBgy5B8nG64f5PG0ugo9kNwKHfl9qEboYHILdDh5/f3tCeS16BTyuvGI/AjvTerv5ksj1590Irn2pJNmeQ06mVyDTicvv5tPgLy0pyXIy9CpjdFP+UzLkMvRQuRStBS5DC1GLkGLNEY/cz0tSJ5DS5Kn0XKzfM04WpY8vojC5DG0NHkYLU4eQsuTH9EG5Pv2sCDfok3IfbQN+RttRL6irchft9Wakf+j7cgX9CFb0M8/kH9frqpfpFQAAAAASUVORK5CYII="></img></div> <div id = "shoesleft"><img class = "imgleft" src = "https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcR1pyUMwdx_XBdS_318Mi-l39JKwwmrTJ6onBiVNM-WpyEul9Er"></img></div> <div class = "moreshoes"></div></body></html> And here is my javascript: function picture(img) { this.link = link;}//*All clothingvar top = new picture(https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQqsdG9ZJSEOvFjdUC3Z8SpHh02ML1kbmoq-zF8thO6OiPRESR_);var top2 = new picture(https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQqsdG9ZJSEOvFjdUC3Z8SpHh02ML1kbmoq-zF8thO6OiPRESR_);var pants = new picture();var pants2 = new picture();var shoes = new picture();var shoes2 = new picture();//*All topsvar tops = [top, top2];//*All pantsvar pants = [pants, pants2];//*All shoesvar shoes = [shoes, shoes2];//*topright random generatorfunction toprightfnc(){ var random = Math.floor(Math.random() * tops.length); var tops_generate = tops[random]; document.getElementById("randomtop").innerHTML = tops_generate.link;} Why isn't it working?
  13. Re-sizing picture and thumbnail

    please i respect and appreciate this forum, am working on a project that needed people to upload picture which will go with a thumbnail, i have all that working but i really wish i could resize the picture to fixes Max. Height and a Max width, what i mean is that i want the pictures not to exceed some certin fixed height or weight. these are my codes all working fyn but i need help on how to fix the order. thanks as you input ur blessed efforts <?phpdefine('UPLOADED_IMAGE_DESTINATION', 'uploads/');define('PROCESSED_IMAGE_DESTINATION', 'logo/');function process_image_upload($Field){ $temp_file_path = $_FILES[$Field]['tmp_name']; $temp_file_name = $_FILES[$Field]['name']; list(, , $temp_type) = getimagesize($temp_file_path); if ($temp_type === NULL) { return false; } switch ($temp_type) { case IMAGETYPE_GIF: break; case IMAGETYPE_JPEG: break; case IMAGETYPE_PNG: break; default: return false; } $uploaded_file_path = UPLOADED_IMAGE_DESTINATION . $temp_file_name; $processed_file_path = PROCESSED_IMAGE_DESTINATION . preg_replace('/.[^.]+$/', '.jpg', $temp_file_name); move_uploaded_file($temp_file_path, $uploaded_file_path); /* * PARAMETER DESCRIPTION * (1) SOURCE FILE PATH * (2) OUTPUT FILE PATH * (3) THE TEXT TO RENDER * (4) FONT NAME -- MUST BE A *FILE* NAME * (5) FONT SIZE IN POINTS * (6) FONT COLOR AS A HEX STRING * (7) OPACITY -- 0 TO 100 * (8) TEXT ANGLE -- 0 TO 360 * (9) TEXT ALIGNMENT CODE -- POSSIBLE VALUES ARE 11, 12, 13, 21, 22, 23, 31, 32, 33 */ $result = create_watermark_from_string( $uploaded_file_path, $processed_file_path, 'www.hirectory.com.', 'Arial.ttf', 40, 'CCCCCC', 75, 45, 22 ); if ($result === false) { return false; } else { return array($uploaded_file_path, $processed_file_path); }}/* * Here is how to call the function(s) */$result = process_image_upload('File1');if ($result === false) { echo '<br>An error occurred during file processing.';} else { echo '<br>Original image saved as <a href="' . $result[0] . '" target="_blank">' . $result[0] . '</a>'; echo '<br>Watermarked image saved as <a href="' . $result[1] . '" target="_blank">' . $result[1] . '</a>';}?><form action="" method="post" enctype="multipart/form-data">Select a file to upload for processing<br><input type="file" name="File1"><br><input type="submit" value="Submit File"></form>
  14. Hello everyone. I just created a WordPress website. To let you know, it's a site about WallPapers. I make a post for every image. But I want to have a download button in the post, so the image can be downloaded by clicking on the button. Can someone help me please? The WordPress plugins doesn't work. Thanks in advance!
  15. My personal photo showroom

    Hi there, as a informatics student I had to code something for university. I decided to code my own little website with an Image Gallery to present my photos and at the same time learn php. The goals where: responsive behavoir short and clean (you could call it minimalistic) small introduction of who I am and what I do main focus on pictures and the users experience while browsing through them The goals where not: I don't want to "sell myself" to get clients with this website, because I'm not a freelancer You find the result of my work here: http://andreaslorer.de/index.php Please provide me some feedback regarding: the website overall how smooth is the experience when scrolling through pictures (loading times / lags when scrolling /. . . ) bugs in the responsive behavoir ? in the "downloads" section, do you understand that you could download the gallery (as a open source image gallery) and not the photos which I present on my site? I'm not sure if this gets clear enough. Thank you in advance
  16. types in phpmyadmin

    when people upload image or video to my site, do i store them in any special type in phpmyadmin? are you supposed to use BLOB? What is BLOB? Which of them do i use? I would guess they can store different amount of data, how much do each of them store?
  17. I want to place some images at the top of my site. I wnat the image changes to another image in some secound. what should i do? you can see an example on http://webdars.com
  18. displaying images

    this is my image code. Is there a way for me to make sure that all of it are displayed on the browser? <html> <body> <form action="index.php" method="POST" enctype="multipart/form-data"> <input type="file" name="file" /><br /> <input type="submit" name="submit" /> </form> <?php include "connect.php"; if(isset($_POST["submit"])) { $loc = "bilder/"; if(($_FILES["file"]["type"] == "image/png") || ($_FILES["file"]["type"] == "image/gif") || ($_FILES["file"]["type"] == "image/jpeg") || ($_FILES["file"]["type"] == "image/jpg")) { $file = explode(".", $_FILES['file']['name']); mysql_query("INSERT INTO bilder VALUES('','".$file[0]."', '".$file[1]."')") or die(mysql_error()); $id = mysql_insert_id(); $newname = $id.$file[1]; $path = "$loc$newname"; move_uploaded_file($_FILES['file']['tmp_name'], $path); echo "du har lastet opp et bilde. klikk her <a href='$path'>klikk</a>"; } else { echo "invalid file"; } } ?> </body> </html>
  19. CSS3 Background Images

    I have a problem When I put a background image and after I put a padding value The position of the pictures changes. I do this: .actual { height: 255px; width: 805px; margin-left: 329px; margin-top: -255px; background-color: #555555; position: absolute; background-image: url(imagens/menu_actual_02.jpg); padding: 20px; } how I can fix this?
  20. images

    I am an absolute beginner at HTML. I was doing OK I until I had tried to include an image sourced on my computer. I have used the address of the source file on my computer, but the browser only shows a small square icon. What am I doing wrong? I am saving the file as .html (all files) ANSI. Another question. When files are uploaded to a website containing files housed on my computer, how does the browser locate the files when they are addressed to my computer?
  21. 'Save for web and devices' procedure

    Hello, when I use images, do I always have to “Save for web and devices” through Photoshop in order to speed up the downloading process? It seems to me that the photos always lose on their quality/sharpness.
  22. Good day, I appreciate that this is a popular query but I've been searching the web for answers and I've been unable to get my code to work. I'm trying to create the effect of an animated button on a website. I have a div which contains an <img/>. This image is the "animated button". I have already prepared the additional images to represent the following frames. Now, the JavaScript code I have (which I've pulled together looking at examples) is below. var navAniButton;var aniImgs;var imgAniTimer;var index;var maxImages; function updateVar() {navAniButton = document.getElementById("navAniButton");aniImgs = ["images/Frame1.png", "images/Frame2.png", "images/Frame3.png", "images/Frame4.png", "images/Frame5.png", "images/Frame6.png", "images/Frame7.png", "images/Frame8.png"];imgAniTimer = setInterval(changeAniImg(), 500);index = 0;maxImages = aniImgs.length - 1;} function changeAniImg() {var curAniImg = aniImgs[index];index = (index == maxImages) ? 0 : ++index;navAniButton.src =curAniImg;} The updateVar(); function is called in the body "onload" to update the global variables. When the page is loaded the image src is loaded correctly and then it appears that the JavaScript attempts to change the src, because the image changes to a cross (you know, as if it can't locate the file). But, I can't figure out why it does this. I've opened the debugger and, originally, it advised that the maxImages variable had not been defined. It hadn't. So, I amended that, but now I'm not receiving any errors in the console. I apologise if I've missed something extremely obvious or if I'm omitted something that would help you all out. Let me know if I can help at all.
  23. Hi! I'm experiencing a wierd thing when I open my website in Firefox and Opera. The images loading in with a preloader is shown at actual size shortly before resizing to percentage-size according to my CSS. In Chrome the images appear as they should right from the start. What's the problem here?http://mace.macework.se/trycksaker/ Grateful for help!Thanks
  24. I am trying to copy and paste code from our footer and place it into our header. We wanted to move the social media icons from the bottom to the top of the page, among other things. There are a lot of div tags and a few CSS class tags as well, in the footer. However, I copied only the link and imagde code into the header so that it doesn't try to link to class and css for the footer. My problem is that when I put the code into my header, it ends up bliowing up the first icon and discplacing everything else on the page (in fact, everything else is now missing completely. See the image I've uploaded.) I've tried resizing manuaaly using style="width:;height:;" and I've tried using the width and height within the img tag itself, but nothing is working. The website is www.cleantelligent.com. I can't find any styling within the header that would be affecting this either. We want the social media icons right under the "get started" button. Any thoughts would be very helpful. Thanks!
  25. Issue with image/text padding

    Hi all, My first post on the forum. I've learn a fair few bit from W3 website that has helped me with my blog site but I'm struggling with a couple of things that the users here might be able to help me out with. First of all, on my home page, I cannot seem to get a space between the text and image in the article list. Any ideas? 2. Also, on an article page, how can I set the padding around a gallery? I seem to get really large amounts of space below the gallery which I can't seem to remove. Any suggestions or tips would be greatly appreciated. Thanks, Lexi
×