ceyda Comments - Answer Overflow

ceyda

Posts Comments

KPCKevin Powell - Community

•Created by hAdes on 5/23/2024 in #front-end

SVG's not visible

I, too, face difficulties about SVG's. They look good but can be a trouble sometimes. Glad that I could help!

16 replies

KPCKevin Powell - Community

•Created by hAdes on 5/23/2024 in #front-end

SVG's not visible

In your code, the size of svg changes but the size of path doesn't. You can see that if you inspect the elements. Because of that the image doesn't get smaller but it gets cropped. So it is not invisible, you just see the space in top-left corner. To fix that add viewBox to your svg element:

<svg class="apple-svg" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 814 1000" width="814" height="1000">

<svg class="apple-svg" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 814 1000" width="814" height="1000">

The values are set to its original size. After you add this you can change the size as you wish. And for the gap, I would delete the   between WATCH and the red subtitle, and make the subtitle a  instead of . Styling is easier this way. I use  for inline stylings. So if it's not important, try changing it to .

16 replies

KPCKevin Powell - Community

•Created by ceyda on 5/16/2024 in #front-end

navbar sub-menu doesn't function properly

This is the menu and divs in hizmetler.php:

<div class="titles">
    <div class="service-title active" data-target="#section-one">
        <p>ÇATI</p>
    </div>
    <div class="service-title" data-target="#section-two">
        <p>ÇELİK</p>
    </div>
    <div class="service-title" data-target="#section-three">
        <p>DİĞER</p>
    </div>
</div>

<div class="services">
    <div id="section-one">
      ...
    </div>
    <div class="section-two">
      ...
    </div>
    <div class="section-three">
      ...
    </div>
</div>

<div class="titles">
    <div class="service-title active" data-target="#section-one">
        <p>ÇATI</p>
    </div>
    <div class="service-title" data-target="#section-two">
        <p>ÇELİK</p>
    </div>
    <div class="service-title" data-target="#section-three">
        <p>DİĞER</p>
    </div>
</div>

<div class="services">
    <div id="section-one">
      ...
    </div>
    <div class="section-two">
      ...
    </div>
    <div class="section-three">
      ...
    </div>
</div>

And this is the jquery:

$(document).ready(function() {

    $('#section-one').show();
    $('#section-two').hide();
    $('#section-three').hide();

    $('.service-title:not(li *)').click(function() {
        var target = $(this).data('target');
        $(target).show().siblings('div').hide();
        $(this).addClass('active').siblings().removeClass('active');
    });

    $('.navbar ul li ul li a').click(function(e) {
        e.preventDefault();

        var target = $(this).data('target');
        $(target).show().siblings('div').hide();

        $('.service-title[data-target="' + target + '"]:not(li *)').addClass('active').siblings().removeClass('active');
    });
});

$(document).ready(function() {

    $('#section-one').show();
    $('#section-two').hide();
    $('#section-three').hide();

    $('.service-title:not(li *)').click(function() {
        var target = $(this).data('target');
        $(target).show().siblings('div').hide();
        $(this).addClass('active').siblings().removeClass('active');
    });

    $('.navbar ul li ul li a').click(function(e) {
        e.preventDefault();

        var target = $(this).data('target');
        $(target).show().siblings('div').hide();

        $('.service-title[data-target="' + target + '"]:not(li *)').addClass('active').siblings().removeClass('active');
    });
});

2 replies

KPCKevin Powell - Community

•Created by ceyda on 2/15/2024 in #front-end

How can i keep the value of a textbox after postback

I've tried a couple of ways so the frontend may be a bit complicated

2 replies

KPCKevin Powell - Community

•Created by ceyda on 6/30/2023 in #front-end

Grid in Chrome vs Firefox

Oh, okay thank you. Then I will continue to use Firefox for this one.

3 replies

Gaming

Programming