Jump to content

Search the Community

Showing results for tags 'notepad++'.



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 2 results

  1. Not sure if I worded that right. I am trying to ad a modal to our page. Eventually it will need to be more than one modal but one problem at a time. I am struggling to add multiple images in a modal where visitors can just click on the image and it will enlarge and they can scroll through them. Instead what happens is it gives me the images but no option to click on an arrow which means every image has to opened separately. Can someone help me please as I am not managing with google. This is the coding I found on W3Schools. I just copied and pasted it like I found it and just put my image tag in. I just can't figure out how to add more images. <!-- Trigger the Modal --> <img id="myImg" src="img/t1.jpg" alt="Tinkerbell Party" width="300" height="200"> <!-- The Modal --> <div id="myModal" class="modal"> <!-- The Close Button --> <span class="close" onclick="document.getElementById('myModal').style.display='none'">&times; </span> <!-- Modal Content (The Image) --> <img class="modal-content" id="img01"> <!-- Modal Caption (Image Text) --> <div id="caption"></div> </div> <html> <head> <style> #myImg { border-radius: 5px; cursor: pointer; transition: 0.3s; } #myImg:hover {opacity: 0.7;} /* The Modal (background) */ .modal { display: none; /* Hidden by default */ position: fixed; /* Stay in place */ z-index: 1; /* Sit on top */ padding-top: 100px; /* Location of the box */ left: 0; top: 0; width: 100%; /* Full width */ height: 100%; /* Full height */ overflow: auto; /* Enable scroll if needed */ background-color: rgb(0,0,0); /* Fallback color */ background-color: rgba(0,0,0,0.9); /* Black w/ opacity */ } /* Modal Content (image) */ .modal-content { margin: auto; display: block; width: 80%; max-width: 700px; } /* Caption of Modal Image */ #caption { margin: auto; display: block; width: 80%; max-width: 700px; text-align: center; color: #ccc; padding: 10px 0; height: 150px; } /* Add Animation */ .modal-content, #caption { -webkit-animation-name: zoom; -webkit-animation-duration: 0.6s; animation-name: zoom; animation-duration: 0.6s; } @-webkit-keyframes zoom { from {-webkit-transform:scale(0)} to {-webkit-transform:scale(1)} } @keyframes zoom { from {transform:scale(0)} to {transform:scale(1)} } /* The Close Button */ .close { position: absolute; top: 15px; right: 35px; color: #f1f1f1; font-size: 40px; font-weight: bold; transition: 0.3s; } .close:hover, .close:focus { color: #bbb; text-decoration: none; cursor: pointer; } /* 100% Image Width on Smaller Screens */ @media only screen and (max-width: 700px){ .modal-content { width: 100%; } } </style> </head> <body> <!-- The Modal --> <div id="myModal" class="modal"> <span class="close">&times;</span> <img class="modal-content" id="img01"> <div id="caption"></div> </div> <script> // Get the modal var modal = document.getElementById('myModal'); // Get the image and insert it inside the modal - use its "alt" text as a caption var img = document.getElementById('myImg'); var modalImg = document.getElementById("img01"); var captionText = document.getElementById("caption"); img.onclick = function(){ modal.style.display = "block"; modalImg.src = this.src; captionText.innerHTML = this.alt; } // Get the <span> element that closes the modal var span = document.getElementsByClassName("close")[0]; // When the user clicks on <span> (x), close the modal span.onclick = function() { modal.style.display = "none"; } </script> </body> </html>
  2. Hello from Atlanta, GA

    What's up guys I am currently pursuing my Associate of Applied Science Degree in CIS Internet Specialist-Website Design. I started my first semester this January and planning to attend this fall on August. Looking at the courses I need to take seems like I may not get to learn much of the coding side. I will look up some of this courses to see what they offer. In the mean time I decided to get the ball rolling by teaching myself to code this whole summer to kind of get ahead of the game before I go back to school. Also I have a friend who is part of this huge organization of networking and there's tons of different people in it from different fields including IT. One of her jobs is updating their site, but only the organization in Atlanta GA which is where we live, since is so big they are all over the states like in Cali, Florida, NY, PR, Chicago and so on mainly the big cities. So we skyped a little bit about it she send me the link and when I looked at the site I was expecting a more professional site not that is not but it kind of looks plain. So she asked me if I wanted to take over the whole updating the site gig but as in donating my time without being paid. I though it was a great idea to kind of get my hands dirty and learn more of it. Also later on I will try to attend some of their events to kind of network as well. But I feel really nervous doing that right now since I haven't got myself in to much of web design & development. She invited me to the event they were having this wednsday but I told her it was too soon and I wasn't ready yet for that but I will soon. I need advice from you guys in this particular situation of what do you guys think? So moving along I do have the access pasword and username to edit the site which is going to be basic stuff updating info, adding pictures, adding new events etc... But their site seems like is set up under a WYSIWYG program under their own server. I haven't look at it much or play with it yet on my own but I will tonight. But thats how the site seems to have been build like since it doesn't need of a person to know coding to do some updates to the site every now and then. Well I was lurking around Google trying to figure out a way to teach myself to code and I am so glad I found W3. I started by following the tutorial to the basic of HTML to refresh my memory of when I took one class back in HS. I have been going through this for 2 days so far using notepad and my browser. I also downloaded Kompozer, Notepad++, and SBT2. I still don't know how to work this programs yet but working on that a bit frustrating but IL get there. ****Questions --What do you guys think so far about my college journey toward my Associate degree? --What do you guys think and suggest about the small gig I got offered from my friend? --What do you guys advice on those events the organization gets together from time to time. --What do you guys suggest I handle the gig, any idea how their site seems to be set up? In what ways will it help me? I will get back with more info about the set up. --What order or what method you guys suggest for me to master this field? So far I am at the basic of HTML stage and I though learning to code first and learn design after? I want to be able to learn to design and run websites, blogs and maybe E-Comm. Thanks you guys for reading if you got this far please any valuable advice would be appreciated.
×