bartonlewis Posted June 11, 2018 Share Posted June 11, 2018 I want to use code for a magnifier lens on images that references magnifier.css and magnifier.js. I created a test html document that displays properly in Brackets' Live Preview with images at the correct size, the magnifier lens working and the magnification at the correct size. But when uploaded to my server and displayed in a browser (I tried both Chrome and Opera), it does not. The images are appearing at their magnification size, static (the scrolling lens not working) and overlapping each other. I have never encountered browser behavior that differed from Live Preview, so don't know what would cause this. Before I incorporate my own css into my web page, I need to resolve whatever is wrong how the external css and/or js is being referenced/displayed. I have pasted the test html document following for what it's worth. Thanks for anyone who can assist. <!DOCTYPE HTML> <html> <head> <link type="text/css" href="magnifier.css" rel="stylesheet"> <script type="text/javascript" src="magnifier.js"></script> <div class="magnifier" style="width: 498px; height: 384px;"> <div class="maglens"> <img src="http://bartonlewisfilm.com/img_157-229.jpg" class="maglarge" style="width: 997px; height: 768px;" /> </div> </div> <div class="magnifier" style="width: 504px; height: 384px;"> <div class="maglens"> <img src="http://bartonlewisfilm.com/img_157-245.jpg" class="maglarge" style="width: 1008px; height: 768px;" /> </div> </div> <div class="magnifier" style="width: 485px; height: 384px;"> <div class="maglens"> <img src="http://bartonlewisfilm.com/img_162-365.jpg" class="maglarge" style="width: 970px; height: 768px;" /> </div> </div> </head> </html> Link to comment Share on other sites More sharing options...
Ingolme Posted June 11, 2018 Share Posted June 11, 2018 My guess is a problem with the Javascript, but there is not enough information in your post to know for sure. You should check your browser's development tools by pressing F12 and look for Javascript error messages in the console. Link to comment Share on other sites More sharing options...
bartonlewis Posted June 11, 2018 Author Share Posted June 11, 2018 Thank you. In Chrome, this is what I am seeing in the Console. So the server is not finding the referenced css or js - but it's not clear to me how it could, since their address simply consists of their name and the extension in the html doc. Isn't more required to find them wherever they exist in cyberspace? Or if not, how can I find out why they won't load? Link to comment Share on other sites More sharing options...
Ingolme Posted June 11, 2018 Share Posted June 11, 2018 That works if the files are in the same directory as the HTML file. If they're not then you will need to specify the path to the file. Link to comment Share on other sites More sharing options...
bartonlewis Posted June 11, 2018 Author Share Posted June 11, 2018 I have returned to the page where I found the demo for this code and see the instruction to do just what you said with the links provided at the top of the message. My bad for not paying close attention and creating more work for myself. Thank you. Link to comment Share on other sites More sharing options...
acemindtech Posted June 13, 2018 Share Posted June 13, 2018 Hi... Bartonlewis How to make a logo icon HTML and css and do you know best web development in Delhi Link to comment Share on other sites More sharing options...
justsomeguy Posted June 13, 2018 Share Posted June 13, 2018 If you are looking for the best web development company in Delhi, you really need to use someone who knows how to make logos and use CSS. It sounds like the people at acemindtech in Delhi do not know how to do basic things, because they keep asking about it here. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now