hello i will need some of your lights in here.i have these cdr files and i want to make them html website.i have managed to make the cdr into jpg and then by mapping made them into some kind of a page.The thing is that it loads differendly in monitors and also i am unable to make it look nice.any suggestions of how i can make this jpg into a website since i am not really good in coding or at least make it look good in all kinds of monitor?
thanks in advance [my corel draw][1]
Change line 21 which set the height as 99% in to this:
height: initial !important;
Related
I have a strange problem and I just can't solve it. I guess the problem is in the image files. I have a folder called project, inside I have two folders named images and web - my files are in web.
In images I have total of 4 images. I'm trying to set background-image and the problem is its only working with 1 of the 4 images. I use this and it works:
body{
background-image: url("../images/space.png");
}
And when i change it - Nothing!? :) :D
body{
background-image: url("../images/123.png");
}
It works with 1 img file but not with others.
And a few minutes ago it was working fine...
I know its really simple question for some, but I'm just getting into html/css.
Just tryed random png picture and it works fine. The picture that iam trying to set its also png and 3hrs back it worked, then stoped... I just dont know what to say :D Picture number 3 is jpg, was working perfect too before 3hrs, not anymore..
I've just lost several hours with this pictures, still dont know how to explain it.. :)
Please check if all images in .png format.
Perhaps other 3 images are .jpg.
It is hard to understand what is wrong with your project without watching on it. Maybe you could upload all files to some place? Maybe the size of images is so different that you can't see it in the image container.
So the title pretty much say's it all, In case anyone is interested I'm self thought so please don't be so hasty to say I did no research or put any effort into this because I've messed around with a lot of various things on this somewhat BS page and searched using Google Yahoo and Bing looking for a similar issue. Basically the table layout seems to to get like a default transparent overlay, I noticed its only directly on the table because the background images are clearly visible when scrolling past the top of the page and its visible in each table cell.
Like I said I've tried various things with no luck but if this is just some common newbie mistake please point me to some reading material or even a good book for web design as I could really use the know how and wouldn't mind learning something as apposed to shooting in the dark with random bits of HTML, CSS and JavaScript in the little free time I do have..
*Also I was doing all this using blogger as my "host" mainly because I plan to ingrate the blogger framework or whatever into the page after I know its good to go. Find a link to the page below, If you need the raw HTML not formatted to blogger just let me know.
https://layout-dev.blogspot.com
Turns out the image host for the body background-image wasn't loading in the image on apple device's, still not sure why but after relocating the image to my personal Dropbox and directly linking to it that solved the problem. *As weird as that may sound the original url was http://subtlepatterns.com/patterns/binding_dark.png and simply replacing it with https://dl.dropbox.com/s/njcu65h90cmsbp8/binding_dark.png solved the problem. -Figured I should post the answer just in case someone ever has a similar issue.
I was wondering what the best way to have a large HD image load on my website.
When simply using it as a background image, there is a delay and there is nothing on the screen for a about 5 seconds before it slowly slides down the screen.
I had an idea that maybe stacking multiple images on top of each other with increasing quality, so that at first you get bad quality, then when the HD is available and loaded, it is made visible on top of the bad quality image.
I guess really my question is, is this my only solution? Are there any better ways to do this?
Thanks.
Look into image interlacing.
It can supposedly do what you want, though I don't have experience with it myself.
It does seem to be the way Facebook works to me.
Also see this question on SO, as provided by janith in the comments below: Load an image via Interlacing - From low to full resolution - HTML
i am making a website where i want one huge image to cover the complete background. I have seen many websites where the images in the background look to be of very high quality and still the pages load really quickly. How?
for example look at this link http://g2geogeske.com/menus
how can i achieve images with quality like these without compromising with the load time. Also if anyone knows of any tutorial or site which explains this please post the link to thanks.
even after being so big its just 170 kb(backgroung in link).my images are at about 700 kb and still look of lower quality then the one in the link. Am i missing something. some trick or anything??
You want to know how to compress images? Go download a decent image viewer (Irfanview) or editor (Paint.NET) and go to town! The background for the site you linked is a 171kb jpeg file; that's peanuts for a half-decent internet connection.
usually when you save an image as a jpg, you have the option to specify a 'quality' rate. If you look at the image in the site you linked, the background image, even though it's really big, it's only 170K. To me, the magic number to save a JPG is 90% quality.
ADD: Also, if you use Irfanview, you can add a plugin called 'RIOT' that compresses images even further (I think you can also get it as stand-alone or something) http://luci.criosweb.ro/riot/
i have a image that i don't want it drag-able or selectable so that no drag to other places on the page. how is that done?
If you want your visitors/users to see the resource on your page there is no way to stop them downloading it or saving it.
Possible options:
You can use JavaScript to prevent the context-menu popping up on right-click (related article: http://javascript.about.com/library/blnoright.htm).
You can cover the image with a transparent .png or .gif so that clicking on the image simple returns the transparent image.
But if the user can see the image on the webpage then it's already on their computer.
In reality this is far harder than you may think it will be, I assume you don't want people stealing your images which is a fair enough thing but just remember all the different ways in which someone can get an image from a web site. Your can catch the right click event and stop them at least doing that, but they can always just take a screenshot and save that instead. This is a slippery slope and it always ends the same way, if they really want to steal it, they're going to.
Since the image is just a binary data, and all the data is written on client PC's, for displaying reason it's up to th euser what they'll do with the data. There's no way you can prevent them from saving the picture displayed on a website.
All you might do is make it a little bit harder, by blocking right clicking on image, (displaying alert on right click, or something like this). But if the user really wants to save the picture they will do this anyway.
Why should you do it?
I can suggest a javascript that will able it: http://www.brownielocks.com/stopcopying.html
But every one, even with little experience can view the source and copy it. and even if you block them from viewing the source, they can use wireshark and get the picture directly. Even if you use flash to show the picture one can screen-capture the screen and retrieve the picture.
Put a watermark on the picture and use http://www.tineye.com/ from time to time and search for your picture. If you find others that use your picture - sue them. It is the most effective way.
It is impossible to prevent someone to store an image (or other resources) on their computer as others already have mentioned.
But another trick to make it harder (impossible for inexperienced people I guess) is to use CSS and background images:
<div style='background: url("myimage.gif");'></div>
The image is now on the background of the <div> block and cannot be dragged or right clicked in order to save it.
Using some coding knowledge it is possible to ind out the myimage.gif part, which can be added after the base URL in order download the image and save it. For example if the HTML page is at http://www.example.com/mypage.html the image could be found at http://www.example.com/myimage.gif
As I mentioned it is still possible to save the image, but for inexperienced people it is a lot harder.
Note: In this example the image is just put in the HTML tag, but with proper use of a CSS file, it is even harder to find for inexperienced people.
You cannot prevent a user from saving something from the web to his PC. The nearest thing that comes to my mind is the -moz-user-select CSS property... https://developer.mozilla.org/en/CSS/-moz-user-select
This javascript snippet does exactly what OP asks:
document.addEventListener("dragstart", preventDrag);
function preventDrag(event) {
event.preventDefault();
}