Jump to content

rain13

Members
 View Profile  See their activity

  • Posts

    346

  • Joined

  • Last visited

 Content Type 

Everything posted by rain13

  1. rain13
    Tnx
  2. rain13
    Ok I've got a little closer to what I want but I still have question:How do I make shadow at sides to reach top and bottom?If you run this code you will see that that shadow at sides wont reach to top or bottom. Upper corners have no shadow. I tried to change vertical-offset, but then it causes shadow to appear at bottom. <!DOCTYPE html><html><head><style> a{ background-color: #FFF; border-radius: 5px 5px 0px 0px !important; position: relative; font-size: 24px;}</style></head><body><a style="box-shadow: 5px 0px 5px -5px rgba(1, 1, 1, 0.7), -5px 0px 5px -5px rgba(1, 1, 1, 0.7), 0 -5px 5px -5px rgba(1, 1, 1, 0.7) ;" href="#">New Tab</a></body></html>
  3. rain13
    Hello. I found example that works for me except that I need to remove shadow from bottom. How do I do that? <!DOCTYPE html><html><head><style> div { width: 300px; height: 100px; background-color: yellow; box-shadow: 0px 0px 5px rgba(1, 1, 1, 0.7);}</style></head><body><div></div></body></html>
  4. rain13
    I figured that when I moved it from local host to real host, load time went from 0.1 sec to 1 sec for some reason although the mysql server is still located at localhost.
  5. rain13
    Hi, I have written quite large software that is by it's functionality close to drupal or gallery 3 or other such software. Now I counted calls to mysql_query and it turned out that when I read article, it does 83 calls and when I view gallery it does 66 call to this function. I am wondering if it is ok if software is big and functional like some professional cms or should I be worried because of that great number of queries?
  6. rain13
    tnx
  7. rain13
    Hello. I use hash #fullscreen to tell javascript that gallery image should be shown in fullscreen mode. When I click on fullscreen button, the following line in ran: window.location.hash = "fullscreen"; Now when I click back button, #fullscreen gets replaced by # and fullscreen mode does not go away because page is not reloaded. How to fix this problem?
  8. rain13
    Hi, I have noticed that max-width:100%; max-height: 100%; doesn't really force image to fit in in div. In example below, I want to use max-width:100%; max-height: 100%; in order to limit image size. Is there way to do it with html/css only, or should I write javascript that calculates height/width in pixels? <html> <head> </head> <body> <div style="position: fixed; display: table; background: #F00; width:100%; height:100%; left:0px; top:0px;" > <span style="background: rgb(255, 255, 255) none repeat scroll 0% 0%; width: 100px; top: 0px; right: 0px; position: absolute;">Close</span> <span style="color: white; width: 100px; top: 0px; position: fixed; left: 0px;">Title of image</span> <div style="vertical-align: middle; display: table-cell; background: #0F0; text-align: center; width:100%;"><img style="max-width:100%; max-height: 100%;" src="http://www.rarepalmseeds.com/images1000/areca-catechu-dwarf.jpg"></div> </div> </body></html>
  9. rain13
    Tnx.
  10. rain13
    There's problem with top 50% - if you try with some larger image such as you will notice that it's rather bottom than in middle. I need size independent solution.Here's a new code I've made but can anyone tell me why the image disappears when browser window is too narrow (when browser window width < image width)? <html> <head> <style> #header { position: fixed; top:0px; left:0px; height: 100%; width: 100%; background: #000; text-align: center; } #header:before { content: ''; display: inline-block; vertical-align: middle; height: 100%; } #header > div, #header > img { vertical-align: middle; max-width:100%; max-heigth: 100%; } </style> </head> <body> <div id="header"> <span style="background: rgb(255, 255, 255) none repeat scroll 0% 0%; width: 100px; top: 0px; right: 0px; position: absolute;">Close</span><span style="color: white; width: 100px; top: 0px; position: fixed; left: 0px;">Title of image</span><img src="http://media-cdn.tripadvisor.com/media/photo-s/01/e4/f8/e6/another-view-of-landscape.jpg"> </div> </body></html>
  11. rain13
    I tried with different browsers and if I open the html file which code is above, image is at the top, not in the middle. So what shall I change in code?
  12. rain13
    In this html code, image is aligned to top. <html> <head> <style> .frame { height: 100%; width: 100%; background-color: blue; text-align: center; } img { background: #3A6F9A; vertical-align: middle; } </style> </head> <body> <div class=frame> <img src="http://jsfiddle.net/img/logo.png"/> </div> </body></html> But here with same code it's in the middle:http://jsfiddle.net/vxruk9jq/Could anyone tell me why this html file doesnt work as I want but code linked below code snippet works? And how could I fix my code?
  13. rain13
    Thanks for example.Sorry for bothering you a little too much. I dont know why I didn't manage to understand it from your previous messages.Yes, I never thought there was anything wrong with tables.And If I want those links to be next to image instead of on the image then is it fine if I use negative (-30)left and right values in #prev and #next?
  14. rain13
    What's wrong with table?Could you be so nice and give some coding ideas for previous code? Basically the problem is that I dont understand your replies enough to use them.
  15. rain13
    Didn't understand how to use this. So remade it a little.So I tried something else: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head></head><body><table style="text-align: left; width: 100px;" border="0" cellpadding="2" cellspacing="2"> <tbody> <tr> <td style="margin: 0px; cursor: auto ! important; background: #0f0;"><div style="font-size: 28px; padding-left: 7px; width: 40px; height: 100%;"><a href="#p" style="background-color: red; height: 100%; display: inline-block;">fgh</a></div></td> <td><img src="https://dl.dropboxusercontent.com/u/65639888/image/4.jpg"></td> <td> </td> </tr> </tbody></table></body></html>But what do I have to do now to make this div or link take 100% of height?
  16. rain13
    .nvgt{ position:relative; top: 0px; height: 100%; width: 30px; opacity: 0.6; }now buttons aren't displayed at all. Could you give some actually working advise please?
  17. rain13
    Hello, I found prev and next buttons example. I tried to modify it for my needs. However I have few questions:1) How to make those prev and next button's height to be 100% of parent div, and not of body?2) How to move image next to prev button? It's currently under it, I want it to be next to it.3) How to move next button right next to image? It's currently at the right side of screen, away from image, how can I move it right next to image? <!DOCTYPE HTML><html> <head> <style> .nvgt{ position:absolute; top: 0px; height: 100%; width: 30px; opacity: 0.6; } .nvgt:hover{ opacity: 0.9; } #prev{ background: #000 url('https://dl.dropboxusercontent.com/u/65639888/image/prev.png') no-repeat center; left: 0px; } #next{ background: #000 url('https://dl.dropboxusercontent.com/u/65639888/image/next.png') no-repeat center; right: 0px; } </style> </head> <body> <div> <img src="https://dl.dropboxusercontent.com/u/65639888/image/4.jpg"> <a class="nvgt" id="prev" href="#prev"></a> <a class="nvgt" id="next" href="#next"></a> </div> </body></html>
  18. rain13
    Hello.This is my code: <div> <div style="float:right; text-align: left; padding-right: 10px;"> <a class="lpadding" href="">edit</a> <a class="lpadding" style="color: #cc0000" href="">delete</a> <a class="lpadding" href="">warn</a> <a class="lpadding" href="">details</a> <a class="lpadding" href="">report</a> </div> <a href="./?p=241"> <h2 style="margin: 0px 0px 1em 0px; padding: 0px;display: inline-block;">Title of post</h2> </a> <a tyle="font-size: 20px;" href="./?f=7">Back to thumbnails</a> <br> <span class="post_time">By user on 2014 Aug 1 13:14:57</span></div> I want to align "Back to thumbnails" center but still keep it on same line with action buttons such as edit, delete, ... and with heading. So I basically need to have align left (for title), align center (for "Back to thumbnails" ) and align right (for buttons) on the same line. How can I do that?I mean one way would be to use table but when I fix cell widths to 33% then it might not be enough for title sometimes. I want that "Back to thumbnails" be center, no matter how long the title is.An other question is thet there's a huge vertical space between this line with heading and buttons and "By user on 2014 Aug 1 13:14:57". How can I reduce that white space?
  19. rain13
    That makes all thumbs to be at left side of green box. I'd like to keep them in a centre of green box as it is not, but I just want last row to start where rest of rows start.
  20. rain13
    Thank you!Now I have one more question: if I have less thumbnails on last row than on previous rows then they're also in the middle. How can I make the last row start from as left as where the rest of the rows starts?
  21. rain13
    Hello.I have feq questions with my site:1) I made span with green background which according to source code should be parent for all thumbnails, but for some reason it ends before thumbs:2) What would be the best way to align thumbnails center? I mean they're currently at left side and if there's not enough room to create an other column you will just see ugly whide area at right side. What I want to do is still have as many columns as possible and but just have white space equally at right AND left side 3) For mobile I use also include http://autoit.net.ee/pub/theme/new/mobile.css which makes font larger so that it's easier to read. This file contains .thumb{ line-height: 100%; height: 360px;} where line-height: 100%; is needed in order to make make thumbnai'ls description more compact (take less space with same font size) but it also causes portrait images to have ugly whitespace between image and it's description. As you can see from screenshot (see first thumb). What do I need to do to make this text in description still look like it does with line-height: 100%; but remove that space between thumb and it's description? My site:http://autoit.net.ee/pub/?f=7
  22. rain13
    Tnx for info.I have written this resize function: function resize_img(){ //var max_h = Math.min(parseInt($(window).height()*.8),600); var max_h = parseInt(Math.min($(window).width(), $(window).height())*.8); var max_w = $("#content").width() - $(".navigation").width() -10; //alert("asd"); if($(".post_container > div:nth-child(1)").width() > max_w){ console.log("resize:GT"); //alert("s00"); $(".large_container").css("height",""); $(".large_container").css("width",max_w+"px"); }else{ console.log("resize:LT,EQ"); //alert("s"); $(".large_container").css("height",max_h+"px"); $(".large_container").css("width","100%"); }}I first wrote code for portrait images, and then discovered that it breaks landscape images by making them partially go out of right border. So I made if statement that should catch the case when image is too wide.But sometimes when I play around with windows sizes image gets resized falsely.Here's portrait example:http://autoit.net.ee/pub/?id=124And here's landscape example:http://autoit.net.ee/pub/?id=148Any ideas how I could write better function?
  23. rain13
    Hi I want to fit image into parent div and keep it's ratio. max-width: 100%; and max-height: 100%;work only when parent height is in px but as soon as I use % it does not work anymore. How can I set parent's height in % and still have max-width: 100%; and max-height: 100%; working? When I set to % then the div just get's as long as it's needed to fit image and goes out of screen even. Is there way to set parent height to 70% and still fit the image the way it's currentöy fitted with out using java script? <!DOCTYPE html><html><head><style>.child{ max-width: 100%; max-height: 100%;}.parent{ width:100%; text-align: center; background-color: #00AA30; padding: 3px; height: 800px;}</style></head><body><div class="parent"><img class="child" src="http://img1.wikia.nocookie.net/__cb20100402141305/half-life/en/images/a/a5/Wheatley_floor_Test_Chamber_08.jpg"><!--<img class="child" src="http://www.real-tuning.com/wp-content/gallery/high-performance-diesel-trucks/Diesel-Trucks-cold-air-intake.jpg">--></div></body></html>
  24. rain13
    Didn't understand it.Doesn't already wrap round the code tags?How shall I do that?
  25. rain13
    Thanks. It worked but when I googled how to make syntaxhighlighter to wrap lines I found instructions that told me to .syntaxhighlighter table td.code .line { white-space: pre-wrap !important; word-wrap: break-word !important;} Why didn't this work?Now it breaks line numbering and I tried javascript suggested here, but it didn't work.http://stackoverflow.com/questions/6286733/automatic-line-break-in-js-syntaxhighlighter
×
×
  • Create New...